Question

例如，如果我有这种结构：

<parent-component>
    <child-a class="a"></child-a>
    <child-a class="b selected"></child-a>
    <child-b class="c"></child-b>
    <child-b class="d"></child-b>
    ...
</parent-component>

如何在ParentComponent中使用类“.selected”访问ChildA的实例？

编辑：在ParentComponent中，我有一个包含10个对象的列表（在属性items中），并在其模板中循环遍历items数组，并为每个项创建ChildA或ChildB组件（ChildA或ChildB是否依赖于项目中的一些配置。

然后点击任何项目，我将其标记为“已选中”（items中的相应对象存储为selectedItem）。稍后我需要访问与selectedItem对应的组件（并且具有“.selected”类“）。

Answer 1

在您的父母中使用@ContentChild或@ContentChildren。

例如：在你的情况下使用： @ContentChildren(ChildComponentA) childs: QueryList<ChildComponentA>; 你有所有的孩子现在只是简单的迭代。

有关详情，请访问：https://angular.io/docs/ts/latest/api/core/index/ContentChildren-decorator.html

编辑：您可以在子级中使用ElementRef来检测所选的类，此处您就是一个示例：

plunkr here 这是你想做什么的？

Angular2：通过css类

1 个答案: