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>
我想为执行方法的按钮创建一个通用组件,然后在子组件内部处理结果。据我了解 @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>