使用 Angular 更改值时调用方法 2

Question

如何在使用 Angular 2 更改值时调用方法？

 <select [(ngModel)]="searchMonster">
     <option>36</option>
     <option>37</option>
 </select>

我尝试使用 ng-change 但没有成功。

Answer 1

使用ngModelChange。检查 template syntax docs.

试试这个

<select
  [ngModel]="searchMonster"
  (ngModelChange)="yourMethod($event)">
     <option>36</option>
     <option>37</option>
</select>

另一个与我合作的 <input> 标签，试试这个 <select>

<select #option
  [ngModel]="searchMonster"
  (ngModelChange)="yourMethod(option.value)">
     <option>36</option>
     <option>37</option>
</select>

Answer 2

基本上根据我的观察，当我们必须在 angular 中使用双向数据绑定时，会调用 [(ngModel)]。所以 view 和 controller/method 是通过绑定调用的。我们可以使用 [(ngModel)] 作为 [ngModel] 和 (ngModelChange) 进行变化检测，但在这种情况下，onChange() 会根据此答案为每个 select 列表变化调用两次] 但是当你想在更改时调用方法时，你可以在这里使用这种方式：-

<select [(ngModel)]="selectedDevice" #device (change)="onChange(device.value)">
    <option *ngFor="#i of devices">{{i}}</option>
</select>

onChange(deviceValue) {
    console.log(deviceValue);
}

我发现这个问题的最佳答案是

使用 Angular 更改值时调用方法 2

Call a method when the value is changed using Angular 2

ionic

angular