Angular2获取动态创建的输入的值

发布时间：2020-12-17 17:32:03 所属栏目：安全来源：网络整理

导读：我有这个输入是从列列中动态创建的,现在我需要在某些方法出现时获取所有输入值(想象getAllValues()) div *ngFor="let cell of column; let i = index;" !-- Material design input-- md-input type="{{cell.type}}" value="{{getInputValue(cell)}}" [placeh

我有这个输入是从列列中动态创建的,现在我需要在某些方法出现时获取所有输入值(想象getAllValues())

<div *ngFor="let cell of column; let i = index;">
              <!-- Material design input-->
              <md-input type="{{cell.type}}" 
                 value="{{getInputValue(cell)}}" 
                 [placeholder]="cell.label">
              </md-input>
      </div>

获取所有生成输入的值的angular2方法是什么？

解决方法

最简单的方法是使用ngForm

<form #myForm="ngForm">
      <div *ngFor="let cell of column; let i = index;">
          <md-input [type]="cell.type" 
             [name]="cell.name"      <!-- Note the 'name' has to be set -->
             [ngModel]="cell.value"
             [placeholder]="cell.label"></md-input>
      </div>
      <a (click)="getAllValues(myForm)">print values</a>
</form>

然后,您将可以访问getAllValues()函数中的myForm.form.value对象.
Plnkr：https://plnkr.co/edit/84mzcNJliMmvszPq3xMm?p=preview

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!