Używasz node
zmienna w drugim ngFor
poza jej zakresem. Ta zmienna istnieje tylko wewnątrz elementu (i jego atrybutów), które ngFor
działa dalej.
To, co prawdopodobnie chcesz zrobić, to poczekać na zmiany wybranej wartości pierwszego wyboru, zaktualizować jakąś zmienną w kontrolerze, co powinno następnie spowodować drugie ngFor
do aktualizacji. Można to zrobić za pomocą ngModelChange
:
<div class="row">
<div class="col-md-12">
<label>Choose a room</label>
<select [(ngModel)]="nodes" (ngModelChange)="selectedNode=$event.target.value">
<option *ngFor="let node of nodes"[ngValue]="node">{{node.name}}</option>
</select>
<br/><br/>
<label>Choose an item</label>
<div *ngFor="let module of selectedNode.modules">
<select [(ngModel)]="channels">
<option *ngFor="let channel of module.channels">
{{channel.name}}
</option>
</select>
</div>
</div>