Angular 2, отфильтрованный вложенный раскрывающийся список на основе родительского раскрывающегося списка - PullRequest
0 голосов
/ 05 октября 2018

Я работаю над выпуском Kendo в приложении Angular 2.У меня есть два раскрывающихся списка, список второго раскрывающегося списка зависит от выбора первого раскрывающегося списка.На стороне компонента я вижу его правильный список фильтрации, но во втором раскрывающемся списке всегда отображается тот же список, что и вначале, не знаю, почему!

template

<div>

 <p>Listed Clients</p>

  <kendo-dropdownlist [data]="clientsData" [(ngModel)] = "selectedClient" [textField]="'name'" [valueField]="'id'"  (ngModelChange)="onChangeClientSelection($event)" class="full-width">
  </kendo-dropdownlist>
</div>


<div *ngIf="consultationsData">
   {{consultationsData[0].name}}

     <p>Listed Consultation</p>

   <kendo-dropdownlist [data]="consultationsData" [(ngModel)] = "selectedClient" [textField]="'name'" [valueField]="'id'"  (ngModelChange)="onChangeClientSelection($event)" class="full-width">
  </kendo-dropdownlist>

</div>

component

export class myComponent implements OnInit {

 private clientConsultationDataItem:any;
 private clientsData:any[];
 private consultationsData:any;

 private getClientFilterConsultation(clientReference:any){
   this.clientConsultationDataItem.forEach(element => {

  if(clientReference["id"] == element.client["id"]){
    this.consultationsData = element.consultations;
    console.log("listed consultation ", this.consultationsData);
   }
 });
}


public onChangeClientSelection(event:any)
{
  console.log("dropdown event fired", event);
  this.getClientFilterConsultation(event);
}

Ответы [ 2 ]

0 голосов
/ 06 октября 2018

Вы также можете проверить следующий пример документации каскадных списков DropDownList:

DOCS DEMO

0 голосов
/ 05 октября 2018

Я неправильно связался с NgModel

<div *ngIf="consultationsData">

 <p>Listed Consultation</p>
  <kendo-dropdownlist name='ConList'
   [data]="consultationsData" 
   [(ngModel)] = "selectedConsultation" 
   [textField]="'name'" 
   [valueField]="'id'" 
   class="full-width">
  </kendo-dropdownlist> 
</div>
...