(change) vs (ngModelChange)的角度

  • Z时代
  • 2024-01-10
  • 分类：问答

Angular 1不接受onchange()事件，它仅接受ng-change()事件。

另一方面，Angular 2接受(change)和(ngModelChange)事件，两者似乎都在做相同的事情。

有什么不同？

哪个最适合表现？

ngModelChange：

<input type="text" pInputText class="ui-widget ui-text"
    (ngModelChange)="clearFilter()" placeholder="Find"/>

vs change:

<input type="text" pInputText class="ui-widget ui-text" 
    (change)="clearFilter()" placeholder="Find"/>

回答：

(change) 事件绑定到经典输入更改事件。

即使您没有输入模型，也可以使用（更改）事件，如下所示：

<input (change)="somethingChanged()">

(ngModelChange)是@OutputngModel指令的。模型更改时将触发。如果没有ngModel指令，则无法使用此事件。

当您在源代码中发现更多内容时，将(ngModelChange)发出新值。

因此，这意味着您具有这种用法的能力：

<input (ngModelChange)="modelChanged($event)">
modelChanged(newObj) {
    // do something with new value
}

基本上，两者似乎没有太大的区别，但是ngModel使用时事件会获得力量[ngValue]。

  <select [(ngModel)]="data" (ngModelChange)="dataChanged($event)" name="data">
      <option *ngFor="let currentData of allData" [ngValue]="currentData">
          {{data.name}}
      </option>
  </select>
dataChanged(newObj) {
    // here comes the object as parameter
}

假设您尝试了没有“ ngModel事物” 的相同事物

<select (change)="changed($event)">
    <option *ngFor="let currentData of allData" [value]="currentData.id">
        {{data.name}}
    </option>
</select>
changed(e){
    // event comes as parameter, you'll have to find selectedData manually
    // by using e.target.data
}

以上是 (change) vs (ngModelChange)的角度 的全部内容， 来源链接： utcz.com/qa/415634.html

回到顶部