angular - 在角度 2 中选择具有 1 个哈希选择的 viewchild

Question

有没有技巧可以在同一级别内选择具有相同标签的多个标签？

<div #el></div>
<div #el></div>
<div #el></div>

它总是给出“引用“#el”被定义多次”错误消息。

提前致谢

Answer 1

下面的方法对我来说对我的多个元素都可以使用，并具有适当的选择器。

我需要从代码库动态加载弹出模式，并执行一些操作，如最小化、最大化、关闭和调整大小。当时我必须选择任何一个打开的模式来执行一些操作，我想出了这个解决方案。

下面是我的 HTML，其中我使用 #dynamicPopupContentPlaceHolder 作为 div 标签的选择器。

首先，需要从 angular/core 库中添加组件中的 QueryList，如下所示。

最后，在组件文件中，我使用 QueryList（包含子数组）来获取所有使用以下方式的子项。

最后，我使用 widgetSelector 变量使用以下方式从数组中获取最后一个孩子。

let _targetSelector = this.widgetTargets.last;

Answer 2

包括ViewChildren。

import {Component, ViewChildren} from 'angular2/core'

现在您可以使用以下代码。

@ViewChildren('el') components:QueryList<ElementRef>;

Answer 3

哦，没关系..我有另一种方法，但不是那么整洁

<div #el>
  <div el></div>
  <div el></div>
  <div el></div>
</div>

然后全选使用 querySelectorAll

@ViewChild('el') element: ElementRef;
this.element.nativeElement.querySelectorAll('[el]')

谢谢大家