在Angular中,可以通过将函数作为输入参数传递来实现。下面是一个示例代码:
首先,在组件中定义一个函数作为输入参数:
import { Component, Input } from '@angular/core';
@Component({
selector: 'app-child',
template: `
`
})
export class ChildComponent {
@Input() onClick: () => void;
}
然后,在父组件中使用子组件,并将一个函数作为输入参数传递给子组件:
import { Component } from '@angular/core';
@Component({
selector: 'app-parent',
template: `
`
})
export class ParentComponent {
handleClick() {
console.log('Button clicked!');
}
}
在上面的代码中,父组件定义了一个handleClick
函数,然后将该函数传递给子组件的onClick
输入属性。
当子组件的按钮被点击时,onClick
函数会被调用,触发父组件中的handleClick
函数,并在控制台输出"Button clicked!"。
请确保在父组件的模板中正确引用了子组件,并在模块中导入了相关的组件。