在使用ionic的時候，會發現有些方法和用html來開發還是有一點區別的，在獲取input框內的資料方式有2種，具體見一下程式碼。

1、使用#變數名的方式

     注意函式的傳值，以及引數型別，獲取值的語句。

    這種方式是HTMLInputElement，故獲取到的值不是一個純粹的值，而是一個輸入的物件元素，需要進一步通username.value

來獲取我們需要的輸入框內的內容。

<ion-input type="text"  placeholder="請輸入賬號" #username></ion-input>
<ion-input type="password" placeholder="請輸入密碼" #password></ion-input>

<button ion-button block color="primary" (click)="login(username, password)">
      登入
    </button>
 

login(username: HTMLInputElement, password: HTMLInputElement) {
   if (username.value == "" || password.value == "") {
      this.presentToast("middle", "error", "賬戶或密碼不能為空");
    } else if((AppConfig.USERNAME==username.value)&&(AppConfig.PASSWORD==password.value) ){
      AppConfig.loginState = true;
      this.checkRemember(username, password);  //儲存使用者資訊
      this.navCtrl.push(GuidePage);
    }
    else {
      alert("賬戶或密碼錯誤！");

    }

}
 

2、使用angular雙向繫結的方式

    這種方式直接繫結的是一個變數，可以直接獲取我們需要的值，通過改變這個變數，達到改變我們需要的值的目的。

<ion-input type="text"  placeholder="請輸入賬號" [(ngModel)]="username"></ion-input>
<ion-input type="password" placeholder="請輸入密碼" [(ngModel)]="password"></ion-input>
 <button ion-button block color="primary" (click)="login()">
      登入
    </button>


login() {
    if (this.username == "" || this.password == "") {
      this.presentToast("middle", "error", "賬戶或密碼不能為空");
    }
    else {
      this.navCtrl.push(GuidePage);
    }
}