Javascript Angular2自动触发ngModelChange

Javascript Angular2自动触发ngModelChange,javascript,angular,Javascript,Angular,因此,我有以下代码: <div class="form-group"> <label for="backings_select">Backing Single</label> <select class="form-control" required [(ngModel)]="selectedBacking" name="backings_select" (ngModelChange)="

因此,我有以下代码:

<div class="form-group">
<label for="backings_select">Backing Single</label>
<select class="form-control"
        required
        [(ngModel)]="selectedBacking" 
        name="backings_select"
        (ngModelChange)="storeValueRedux($event, count)">
  <option *ngFor="let backing of backings" [ngValue]="backing.id" [selected]="backings.length === 1">{{backing.name}}</option>
</select>

支持单
{{backing.name}

它用服务调用的结果填充一个选择框,如果数组长度为1,它会自动选择唯一可用的选项,这很好

但是,默认情况下,选择框使用组件中的值作为其默认值

因此,在进行服务调用时,如果数组的长度仅为1,则模型的值会发生变化,但由于它是自动选择的(不是通过用户输入),因此不会触发storeValueRedux事件


但是,如果数组有多个条目,然后由用户选择,则会调用该函数并根据需要工作。backings.length=1的实例中是否仍有触发ngModelChange的方法?

您不能在HTML中的方法调用中使用条件,但可以使用
change
并按如下方式处理方法中的条件

 <select class="form-control"
    required
    [(ngModel)]="selectedBacking" 
    name="backings_select"
    (change)="storeValueRedux($event, count)">
        <option *ngFor="let backing of backings" [ngValue]="backing.id"
            [selected]="backings.length === 1">{{backing.name}}</option>

返回我支持的服务是可观察的,因此我修改了订阅:

.subscribe(
        results => {this.backings = results},
        error => console.log(error),        
);  
致:

然后加上:

testBackingLength(){
    /* If the length of the arrau is only one, the template auto selects it
    and does not trigger ngOnChange, so we need to manually trigger it here,
    this function is called from the subscribe a few lines up */
    if (this.backings.length === 1) {
    this.storeValueRedux(this.backings[0]['id'], this.count)}
}
因此,每次调用我的服务时,它都会测试数组的长度。如果数组的长度为1,它将自动调用my函数

.subscribe(
        results => {this.backings = results, this.testBackingLength()},
        error => console.log(error),        
);  
testBackingLength(){
    /* If the length of the arrau is only one, the template auto selects it
    and does not trigger ngOnChange, so we need to manually trigger it here,
    this function is called from the subscribe a few lines up */
    if (this.backings.length === 1) {
    this.storeValueRedux(this.backings[0]['id'], this.count)}
}