如果属性未以角度4更改,如何强制更新模板

Question

在我的组件中有一个像这样的模板

template: '<input type="text" value="{{formattedValue}}">',

当输入某些错误输入时,内部的formattedValue属性不会更改,但我希望UI随后更新以显示最后一个正确的值.

例如,如果组件this.formattedValue为1,000并且用户更新输入以使文本1,000xI然后希望输入再次为1,000.目前这不会发生.当然我可以在函数中使用Dom api更新DOM,但我更喜欢使用模板.

Answer 1

template: '<input type="text" [ngValue]="formattedValue" (ngValueChange)="checkValue($event)">',


formattedValue:string = '';
constructor(private cdRef:ChangeDetectorRef) {}

checkValue(event) { 
  if(event == /* invalid */) {
    this.cdRef.detectChanges();
  } else {
    this.formattedValue = event;
  }
}