Angular2 - 输入值未定义

Question

我想通过单击按钮将输入值传递给函数。

<md-card> 
     <md-input-container><input mdInput ngDefaultControl [ngModel]="newInput">
     </md-input-container> 
     <button md-raised-button (click)="newInputValue(newInput)">Update</button>
</md-card>

但是函数newInputValue(..)中newInput的值始终未定义

Answer 1

在下面的 link 中，您正在使用属性绑定（一种方式），因此您无法访问 DOM

中的变量

 <md-input-container><input mdInput ngDefaultControl [ngModel]="newInput">

将 [ngModel] 更改为 [(ngModel)]

或者，

 <div class="button-row">
  <md-input-container><input mdInput #inputVal [ngModel]="newInput">
     </md-input-container> 
     <button md-raised-button (click)="newInputValue(inputVal.value)">Update</button>
  </div>

在上述情况下，您将在您的方法中拥有值，因此您的一种数据绑定方式保持不变

LIVE DEMO第二个选项

Angular2 - 输入值未定义

Angular2 - Input-Value undefined

typescript

angular-ngmodel

angular-material

angular