将函数及其参数传递给子组件

Question

我有一个带有参数的函数的父组件：

parentFunc(parm: any): boolean {
    // do something with the parm
}

其模板的一部分是：

<app-child [func]="parentFunc(123)"></app-child>

在子组件中：

@Input('func') func: any => boolean;

ngAfterViewInit() {
    if (this.func)
        this.func(/* what should be put here? */);
}

基本上，孩子接受函数引用及其实际参数。然后，孩子需要使用参数调用此函数。没有任何参数，我可以简单地调用它。但是有了参数，我该如何实现呢？ this.func.apply(null, parm)将需要子级具有另一个输入属性才能具有参数。

为概括此用例，我希望有一个通用组件将其功能的一部分委托给外界。一个示例是通用的自定义输入字段，该字段将其验证委托给调用组件。通用的自定义输入字段可处理所有精美的动画，订阅/广播客房整理等。它不在乎或不知道应如何验证数据。

Answer 1

<app-child [func]="parentFunc(123)"></app-child>

要传递调用函数的结果，您将需要为参数提供单独的输入。

<app-child [func]="parentFunc" [params]="[123]"></app-child>

您可以使用传播算子调用它

func(...params)