Angular12 - 将函数传递给组件并处理结果

Angular12 - Passing function to the component and handling result

我想为执行方法的按钮创建一个通用组件,然后在子组件内部处理结果。据我了解 @Output 是单向绑定,所以我无法处理传递函数的结果,所以我需要使用 @Input.

这是我想要实现的:

<my-button (action) = "exampleAction" [showConfirmation]="true">Reload</my-button>

但是使用 @Input 我需要使用 .bind(this) 将函数传递给我的组件,这不是优雅的方式。看起来像这样:

<my-button (action) = "exampleAction.bind(this)" [showConfirmation]="true">Reload</my-button>

有没有什么方法(也许使用可观察对象)来创建简单、漂亮的按钮组件,它采用方法、块本身、处理方法并处理它的结果?

此致

您可以组合输出和输入以获得双向绑定。 看看这个 stackblitz

<hello (action)="increment()" [resultAvailable]="resultAvailable"></hello>