Angular2 select-option dropdown chargement dynamique sur la page HTML charger

Question

J'ai une page HTML où j'utilise 2 select - option drop-down Je veux remplir la deuxième liste déroulante sur la base de ce qui est sélectionné dans la première goutte -vers le bas.

Actuellement il y a 2 listes déroulantes J'ai quelques valeurs dans la première liste déroulante sur le chargement de la page pour la première fois que l'on est sélectionné en fonction du résultat API, maintenant je veux lier la liste à la deuxième liste déroulante ce qui est sélectionné dans la première liste déroulante.

Quelqu'un peut-il me aider à le faire dans angulaire 2 HTML select-options

<td> 
    <div> 
     <select #selectedHeading (change)="headingChanged($event.target.selectedIndex)" [disabled]='butDisabled'> 
      <option *ngFor="let heading of headings" [value]="heading.val" [ngValue]="accountitem" [selected]="accountitem.heading === heading.val" > 
       {{heading.val}} 
      </option> 
     </select> 
    </div> 
</td> 
<td>{{accountitem.rules}}</td> 
<td> 
    <select #selectedSubHeading [disabled]='butDisabled'> 
     <option *ngFor="let subHeading of subHeadings" [value]="subHeading.val">{{subHeading.val}}</option> 
    </select> 
</td> 

Answer 1

changement cette variable pour compter ++ dans ngOnInit() et nous vérifierons à l'intérieur de cette méthode.

count:number=0; 
    headingChanged(receivePraam){ 
    if(count){ 
this.butDisabled=true; 
    } 
    else{ 
this.butDisabled=false; 
} 
    //and here set dropdown2 value. 
    }