我的核心组件中有这个功能：
isValid(value: any) {
// Do some stuff and return something based on the result
return false;
}
我将其传递给其他组件,如下所示：
<other-component (onBeforeAdding)="isValid($event)"></other-component>
在其他组件中,我得到了这个EventEmitter函数,它应该在其他事情之前运行并返回一个值,表明值是否有效：
@Output() onBeforeAdding: EventEmitter<any> = new EventEmitter();
let isValid = this.onBeforeAdding.emit(value) ||true;
if (isValid) {
// Do stuff
}
这里的问题是EventEmitter函数不能返回一个值,因为它是异步的(虽然从rc2看起来这似乎是可选的,将true传递给新的EventEmitter函数？但这样做不会解决这个问题).因此无论函数返回什么,isValid将始终为true.
如何从EventEmitter函数返回值？
简短的回答是你不能用@Output做到这一点,但是你可以用@Input做一些非常相似的事情.
原文链接：https://www.f2er.com/angularjs/143872.html核心组件中的相同功能：
isValid(value: any): boolean {
// Do some stuff and return something based on the result
return false;
}
将函数定义作为@Input传递给other-component：
<other-component [onBeforeAddingProcessor]="isValid"></other-component>
在其他组件中：
@Input() onBeforeAddingProcessor: (value: any) => boolean;
ngOnInit() {
// onBeforeAddingProcessor won't be defined in the constructor
let isValid = this.onBeforeAddingProcessor(value);
if (isValid) {
// Do stuff
}
}
访问它的方法
如果必须在您提供的函数中访问它,则必须传递已具有此上下文绑定的方法：
isValid = (value: any) => {
return this.myService.checkValue(value);
}
否则,Angular会使用组件调用方法,而不是组件的使用者.关于性能的小提示(虽然未经过测试)：如果此方法很大且组件的实例数很高,那么您应该将代码的较大部分分解为私有成员函数,并从它所在的位置调用此函数因素考虑在内.原因：上面没有在类的原型上创建函数,但为组件的每个实例标记了此函数的副本.这可能会消耗大量内存,这很容易避免.
