如何在VIEW中获取QueryList <componenta>传递给服务方法

时间:2019-04-09 18:22:55

标签: angular

如何在视图中获取对ComponentA的QueryList的引用,以将ComponentParent传递给[service]方法?我故意提到它是一种服务方法,因为我不想在ComponentParent上调用本地方法。我想在传递给ComponentParent的构造函数的服务上调用方法。除了ComponentParent包含几个ComponentAs之外,ComponentParent和ComponentA之间没有任何关系,这意味着ComponentParent和ComponentA之间没有继承。

假设我定义了一个ComponentA和ComponentParent,并且在ComponentParent的视图中有几个ComponentA:

<ComponentA key="A"></ComponentA>
<ComponentA key="B"></ComponentA>
<ComponentA key="C"></ComponentA>
<ComponentA key="D"></ComponentA>

然后,我有一个按钮,我希望click事件调用一个为每个ComponentA组件执行某些操作的服务方法。像这样:

<button (click)="this.componentServices.ProcessComponents(QueryList<ComponentA>)">Click Me To Process All Components</button>

我不想为每个ComponentA使用模板引用变量,因为我希望每当ComponentA添加到ComponentParent时,它都是自动的。所以,我不想这样做:

<ComponentA **#one** key="A"></ComponentA>
<ComponentA **#two** key="B"></ComponentA>
<ComponentA **#three** key="C"></ComponentA>
<ComponentA **#four** key="D"></ComponentA>
<button (click)="this.componentServices.ProcessComponents(**[one, two, three, four]**)">Click Me To Process Components</button>

我知道我可以在ComponentParent上调用本地方法来执行此操作(我现在正在执行此操作),但是更喜欢从ComponentParent的角度执行此操作,因为我有很多组件,例如ComponentParent,其中包含很多ComponentAs,并且希望消除ComponentParent类型组件中尽可能多的代码。

0 个答案:

没有答案