[ionic] How to set Value Input field


You can do it like that:


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


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

  constructor() {}

  setInput() {
    this.value = 42;

By using [(ngModel)]="value" you bind the value variable to that input field. That way it is always updated. If you change it in the UI, it is immediately updated “in the code”. And when you update it in your code, it automatically updates in the UI.

You should probably read an Angular 2 tutorial before you continue working on your app. Angular provides many tools to make that sort of thing a lot easier.

範例 2:

變數要先定義好在 .ts  檔案裡,不然會跑出 Error: Property does not exist on type

變數定義的範例:public accordition: any;




<form [formGroup]="viewForm" (ngSubmit)="submitView()">
    <ion-textarea type="text" placeholder="Enter your view here." [(ngModel)]="view.text" formControlName="viewTextArea" rows="6" (ngModelChange)="viewTextChange()"></ion-textarea>
    <button ion-button type="submit" block>Send</button>


  public viewTextChange() {
    var left = this.viewMaxLength-this.view.text.length;

    if (left < 0) {
      this.view.text = '' + this.oldViewText;
      left = this.viewMaxLength-this.view.text.length;

    this.charactersRemaining = (this.viewMaxLength-this.view.text.length) + ' characters remaining.';
    this.oldViewText = this.view.text;

    /* this.view.text = 'frank'; */