将子组件的@Input()属性绑定到父组件的函数调用是否可以接受,例如:
IoUsCategory]="hasPrevIoUsCategory()"
(nextClicked)="nextCategory()"
(prevIoUsClicked)="prevIoUsCategory()"
(submitClicked)="submit()"
这似乎有效,但我不知道如何.当从组件触发事件或驱动输入绑定的是什么时,是否重新评估这些输入?
最佳答案
当然.每次更改检测运行时都会调用该函数,并将函数调用的结果分配给input属性.
当2个连续调用返回不同的值时,devMode中会出现异常.喜欢
hasNextValue() {
return {};
}
Exception: Expression has changed …
不鼓励绑定到函数.而是将结果分配给属性并绑定到此属性.
如果你知道你在做什么,那很好.
更新
so returning true / false according to some internal state is not allowed? Strange that my navigation still works
这实际上是允许的.如果您的状态因某些事件(点击,超时,……)而发生变化,那么角度变化检测会发生变化.如果Angular变化检测调用该方法两次(就像在devMode中那样),而两者之间没有发生任何事件,那么它不会期望更改并抛出上述异常. Angular不喜欢的是当变化检测本身引起变化时.
下面的示例也会导致异常,因为更改检测本身会修改组件状态(this.someState =!this.someState;)
这是不允许的.
someState:boolean = false;
hasNextValue() {
this.someState = !this.someState;
return this.someState;
}
即使两者之间没有发生任何事件,两个连续的调用也将返回false和true.
这个例子可以正常工作
someState:boolean = false;
@HostListener('click') {
this.someState = !this.someState;
}
hasNextValue() {
return this.someState;
}
因为两次连续调用(中间没有任何事件)将返回相同的值.