如何在Angular 2中更新相關的組合2

Question

我有兩個組合，第二個組合取決於第一個組合。因此，當從第一個組合中選擇選項時，應該重新加載第二個組合的選項。但是第二個組合的ng-model怎麼能聽到第一個組合的ng-model的更改並更新Angular 2中的選項列表？

Answer 1

一種方式是一個(change)事件處理程序附加到第一個組合：

template: ` 
    <select [(ngModel)]="c1Selection" #c1 (change)="onChange(c1.value)"> 
    <option *ngFor="#v of combo1">{{v}}</option> 
    </select> 
    <select [(ngModel)]="c2Selection"> 
    <option *ngFor="#v of combo2">{{v}}</option> 
    </select> 
` 

class App { 
    combo1 = 'one two three'.split(' '); 
    combo2Map = { 
    one: '1 11 111'.split(' '), 
    two: '2 22 222'.split(' '), 
    three: '3 33 333'.split(' ') 
    }; 
    c1Selection = 'one'; 
    c2Selection = ''; 
    combo2 = this.combo2Map[this.c1Selection]; 
    constructor() {} 
    onChange(c1Value) { 
    this.combo2 = this.combo2Map[c1Value]; 
    this.c2Selection = ''; 
    } 
} 

Plunker