我有一个Angular 2控制器,看起来像这样:
@Component({ selector: 'my-component',template: '<div>The value is: {{ value }}</div>',}) class MyComponent implements OnInit { @Input() value: string; @Output valueChange = new EventEmitter<number>(); ngOnInit() { this.valueChange.subscribe(value => { console.log('new value:',value); // <-- does not get triggered }); } }
但是当值的值从模板绑定更改时:
<my-component [value]="someValue" /> <!-- valueChange not triggered! -->
valueChange事件未被触发,因此即使模板正确更新并显示新值,组件也不知道它已被更改.
如何检测控制器上的输入属性何时更改?
在我看来,输出是你的组件向其他人发出事件所以他们会在必要时更新他们的视图,它应该只用于内部需要广播的更改(因此名称为Output).在输入更改上触发输出事件可能会导致意外行为(因为现在内部和外部的所有更改都会触发valueChange,而不再是输出).
原文链接:https://www.f2er.com/angularjs/142452.html在你的情况下,如果你想在价值变化时做一些事情,你可以把它变成一个设定者:
private _value: string; get value(): string { return this._value; } @Input('value') set value(val: string) { this._value = val; console.log('new value:',value); // <-- do your logic here! }