角度2 - 检测属性@Input的变化

Angular2 - Detect Changes of Attribute @Input

本文关键字：@Input 变化 属性 检测 角度      更新时间：2023-09-26

我有一个简单的属性指令mask，带有@Input() mask:string

我希望能够检测并响应mask绑定上的更改我可以以某种方式使用ngOnChanges，但我觉得这就像用大画笔画问题

指令示例/简化代码：

@Directive({
  selector: 'mask'
})
export class MaskDirective implements AfterViewInit {
  @Input() mask: string;
  constructor(public el: ElementRef) {};
  ngAfterViewInit() {
    $(this.el.nativeElement).mask(this.mask);
  }
}

用法：

<input type='text' [mask]='someBinding'>

当someBinding的值发生变化时，如何执行一些代码，而不依赖ngChanges？

你可以对mask属性使用 setter 方法，而不是更广泛的ngOnChanges：

@Directive({
  selector: 'mask'
})
export class MaskDirective implements AfterViewInit {
  @Input set mask(newValue: string) {
    $(this.el.nativeElement).mask(newValue);
  }
  constructor(public el: ElementRef) {};

}

Setter 会更有效率，因为它只与此属性相关。

相关文章：