迭代Angular2中模板中的所有元素

时间:2017-07-06 04:50:36

标签: angular

我有以下模板。如何访问模板中的所有元素?我尝试使用ViewChildren,但它只引用了一个元素(我猜因为没有两个元素是相同的,我在模板中没有使用相同的指令/组件)

template: `

 <div>Name: <input type="text" name="name" /> </div>
 <div>Gender: <select  name="gender" >
    <option>Male(1)</option>
    <option>Female(2)</option>
  </select>
 </div>
 <div>About you: <textarea ></textarea></div>
 <div>Married: <input type="checkbox" /></div>      
  <div>
  Children:     
    <ng-container *ngFor = "let option of this.selectOptions">
    <input  type="radio" [id]="option" name="children" [value]=option [(ngModel)]="this.children"/> {{option}}
    </ng-container>
  </div>
  <p > Some para</p>
  <p >Para with span <span>Inside span</span></p>

`

问题1 - 如何获取模板中所有元素的集合?

问题2 - 区分元素的方法是什么?我猜所有元素都是ElementRef类型。

1 个答案:

答案 0 :(得分:0)

Angular的想法是你永远不需要这样做。

  

很少有直接操纵DOM的情况   有必要的。 Angular 2提供了一组功能强大的高级API   比如可以使用的查询。    - http://angularjs.blogspot.com/2016/04/5-rookie-mistakes-to-avoid-with-angular.html