Question

有人可以告诉我比较ngModel旧值和新值的最佳做法是什么？

角度1：

$scope.$watch('someProperty', funciton(oldVal, newVal){
    // code goes here
})

我问这是因为(ngModelChange)永远不会给我oldVal，只有newVal。

在我的情况下，我在<select>标记中使用ngModel并将旧选择与新选择进行比较：

<select [(ngModel)]="current" (ngModelChange)="onModelChange($event)">
     <option *ngFor="let item of myArray" [ngValue]="item">{{item.name}} </option>
</select>

Answer 1

这可能有效

(ngModelChange)="onModelChange(oldVal, $event); oldVal = $event;"

或

(ngModelChange)="onModelChange($event)"

oldValue:string;
onModelChange(event) {
  if(this.oldValue != event) {
    ...
  }
  this.oldValue = event;
}

Answer 2

输入字段示例...

<div *ngFor="let value of values">{{value}}
    <input [(ngModel)]="value" (focus)="old=value" (ngModelchange)="doSomething(old, value)">
</div>

doSomething(oldVal, newVal) {
    // some code
}

Answer 3

为了未来

我们需要观察到[（ngModel）] =“ hero.name”只是可以简化为以下内容的快捷方式：[ngModel] =“ hero.name”（ngModelChange）=“ hero.name = $ event”。

因此，如果我们对代码进行除糖，最终将导致：

<select (ngModelChange)="onModelChange()" [ngModel]="hero.name" (ngModelChange)="hero.name = $event">

或

<[ngModel]="hero.name" (ngModelChange)="hero.name = $event" select (ngModelChange)="onModelChange()">

如果您检查以上代码，您会发现我们最终遇到了2个ngModelChange事件，这些事件需要按一定顺序执行。

总结：如果将ngModelChange放在ngModel之前，则将$ event作为新值，但是模型对象仍保留先前的值。 如果将其放置在ngModel之后，则该模型将已经具有新值。

SOURCE

Angular 2 ngModelChange旧值

3 个答案: