我正在创建一个小游戏，我有一个显示武器名称的组件，我们称之为“WeaponComponent” . 武器名称旁边应该出现一些按钮，允许用户执行某些操作，如“fire”，“drop”，“reload”等...但是，这些操作不应该调用相同的代码，具体取决于组件的方式例如，无论我攻击怪物还是其他玩家，“火”动作都应该采取不同的行动 . 请注意，这只是一个例子，更多的变量可以影响要执行的代码 .

到目前为止，我为每个操作都创建了 Input 属性，利用是否显示了操作，因此我可以根据组件的使用位置显示或不显示操作（因为我无法显示"drop in hangar"操作，如果例如，玩家不在机库上） .

此外，每个操作按钮都会显示一个微调器图标，直到操作完成 . 实际上，大多数操作都会进行服务器端调用，所以我想显示一个不错的加载指示器 .

由于单击某个动作时要执行的代码取决于某些变量，因此我想将单击按钮时要执行的函数传递给该组件 . 所以我这样做了：

@Input()
public unmountAction: (id: number) => void | Promise<void>;

...

public async unmount(ac: ActionComponent): Promise<void> {

    if (this.unmountAction) {
        await Promise.resolve(this.unmountAction(this.data.id));
    }

    ac.complete();
}

所以我有一个 Input 接受一个不返回任何函数或 Promise 的函数，这个函数由"unmount"调用，这是单击动作时组件执行的函数 . ac.complete() 仅用于隐藏加载指示器 .

为了清楚起见，让我们调用调用者组件“CallerComponent” .

这种方法的问题在于，执行函数中的关键字“this”不是“CallerComponent”中的关键字，而是“WeaponComponent”中的关键字 .

我猜大多数人都要点击"answer"告诉我使用 Output decorator而不是 Input ，但是，这只是't solve my issue. Indeed, 972305 needs to know when the function is done executing, to hide the loading indicator. Therefore, I can'只是在"EventEmitter"上发出 . 当然，我可以在输出方法中传递"WeaponComponent"的引用，我可以在其上调用隐藏加载指示符的"done"方法，但我想知道是否有比这更好的解决方案 .

angular