如何设置值输入字段Ionic 2

Question

我有一个小问题。

我使用的HTML代码：

<ion-input id="amount" type="number" ></ion-input> 

<button (click)="setinput()">Set Value</button>

这TS码：

setinput(){ 
var input= document.getElementById("amount") as HTMLInputElement; 
input.value=42; 
console.log("amount"); 
console.log(input.value); 
} 

我的控制台告诉我，这个数字得到了改变。但更新的值不会显示在我的输入字段中。你有什么建议吗？

在此先感谢！

L. Trembon

Answer 1

你可以那样做：

page.html中

<ion-input id="amount" type="number" [(ngModel)]="value"></ion-input> 
<button (click)="setInput()">Set Value</button> 

page.ts

export class Page { 
    value: number = 0; // Default is 0 

    constructor() {} 

    setInput() { 
    this.value = 42; 
    } 
} 

使用[(ngModel)]="value"你绑定value变量到该输入字段。这样它总是更新。如果您在UI中更改它，它会立即更新“在代码中”。当您在代码中更新它时，它会在用户界面中自动更新。

您应该先阅读Angular 2教程，然后再继续使用您的应用。 Angular提供了许多工具来使这种事情变得更容易。