Angular @Output:我们能否在发射时检测功能是否完成？

Question

我有Angular Component一个Output.当我emit的event此output,一个async功能将被调用(该功能部件的外部).

在里面component,我想知道这个外部功能何时完成.有没有办法做到这一点？

这是我的组件的一些代码:

@Output() action: EventEmitter<string>;

itemClicked(item) {
    this.action.emit();
    // When the function of the observer is done: this.hideMenu();
}

这是组件外部的代码:

<my-component (action)="getData()"></my-component>


getData() : Promise<any> {
    ...
}

有没有办法检测到"getData"函数已在组件内部完成？

在AngularJS中,我可以这样做:

scope: {
    action: '&'
}
...

    scope.itemClicked = function(item) {
        $q.when(item.action()).finally(function() {
            scope.hideMenu();
        });
    };

编辑:

我正在思考另一个灵感来自Ionic复习的解决方案.如果emit()调用将组件的实例作为参数传递,该怎么办？这样getData函数可以执行以下操作:

getData(menu): Promise<any> { 
    ...
    menu.hideMenu();
}

您对此解决方案有何看法？如果你认为这是错的,那么我想我会选择Input.

Answer 1

我认为你应该@Input在功能完成时使用a 来发送已完成的消息,并且在感兴趣的组件中使用a来监听输入set并执行你想知道函数已完成的事情.