如何通过角度2中的类名获取输入值

时间:2017-09-22 17:56:29

标签: angular angular2-forms

我有一组输入元素:

    <input type="text" name="firstName" class="mandate" />
    <input type="text" name="MiddleName" class="mandate" />
    <input type="text" name="lastName" class="mandate" />
    <input type="text" name="Address" class="mandate" />'

在Jquery中,很容易通过Class获取值,或者我们可以在所有输入元素都具有的类的基础上轻松执行一些常见事件

$('.mandate').each(function(){
console.log("Some....")
});

但是我在徘徊如何在Angular 2中完成。我是Angular 2中的新手。

2 个答案:

答案 0 :(得分:1)

要解决此问题,您可以使用组件中的view children。这将允许您选择模板中的所有元素,类似于jquery的方式。

@ViewChildren('.mandate') mandates;

mandates.forEach((mandate) =>{
     //do something here
});

这将检索具有类授权的所有元素作为数组,并将使用角度变化检测进行更新。

答案 1 :(得分:1)

你可以像在jQuery中使用的那样在angular和querySelector中使用元素引用(ElementRef)。

  constructor(private elementRef: ElementRef) {
  }

  // this is inside any of the method
  // this is to select multiple 
  this.elementRef.nativeElement.querySelectorAll('.mandate');

  // this is to select single
  this.elementRef.nativeElement.querySelector('.mandate')