我在服务中有两种方法,都可以使用不同的控制器来搜索数据库。我想制作一个共享的子组件,该组件将在两个不同的地方使用,但是我需要每个实例都能够专门调用其中一种服务方法。例如,这些是我的方法:
// SERVICE
searchOne(search: string){
// do some searching in Controller 1
}
searchTwo(search: string){
// do some searching in Controller 2
}
我的共享子组件具有与服务相似的方法:
// CHILD COMPONENT
@Input(Function) func: Function;
componentSearch(search: string){
this.func(search);
}
但是,当尝试像这样从父级传递函数时,这似乎不起作用:
// PARENT COMPONENT
func = this.service.searchOne;
constructor(private service: Service){}
// PARENT COMPONENT.HTML
<app-child-component [func]="func"></app-child-component>
如何将对服务功能的访问或引用传递给子组件?
答案 0 :(得分:1)
我已经为您的代码here创建了可工作的Stackblitz
您的代码中很少进行更正:
父组件:
export class AppComponent {
name = 'Angular';
func;
constructor(private service: AppService){
this.func = this.service.searchOne;
}
}
子组件
@Input() func: Function;
componentSearch(search: string){
this.func(search);
}