이온 2 이온 입력 값 받기

Question

이온 성 이온 2를 사용하여 로그인을 생성합니다. "[(ngModules)] 속성을 추가하면됩니다."라고 대답하지 마십시오. 생각하시는 분, 이것이 해결책입니다. 이유를 설명해주십시오. 당신이 아이에게 그런 것처럼 설명하십시오. login.ts에서

내 코드 :

import {Component} from '@angular/core'; 
import {IonicPage, NavController, NavParams, MenuController} from 'ionic-angular'; 

@IonicPage() 
@Component({ 
    selector: 'page-login', 
    templateUrl: 'login.html', 
}) 
export class LoginPage { 
    password: string; 

    constructor(public navCtrl: NavController, public navParams: NavParams, public menu: MenuController) { 
    this.menu.enable(false, ""); 
    } 

    login() { 
    alert(this.password); 
    } 

    ionViewDidLoad() { 
    console.log('ionViewDidLoad LoginPage'); 
    } 
} 

강령 login.html 에서

<ion-content padding id="login-dialog"> 
    <ion-list inset> 

    <ion-item no-padding> 
     <ion-label color="primary"> 
     <ion-icon name="person"></ion-icon> 
     </ion-label> 
     <ion-input type="text" placeholder="Username"></ion-input> 
    </ion-item> 

    <ion-item no-padding> 
     <ion-label color="primary"> 
     <ion-icon name="lock"></ion-icon> 
     </ion-label> 
     <ion-input type="password" placeholder="Password"></ion-input> 
    </ion-item> 
    <button ion-button full color="primary" (click)="login()">Login</button> 

    </ion-list> 

</ion-content> 

Answer 1

당신이 당신의 입력 요소를 결합하지 않기 때문에 위의 코드가 작동하지 않습니다 로그인 구성 요소의 모든 특성 이를 위해 각도 데이터 바인딩을 사용해야합니다.

https://angular.io/docs/ts/latest/guide/template-syntax.html

아래에 코드를 변경하십시오.

<ion-item no-padding> 
     <ion-label color="primary"> 
     <ion-icon name="lock"></ion-icon> 
     </ion-label> 
     <ion-input [(ngModel)]="password" type="password" placeholder="Password"></ion-input> 
    </ion-item> 

입력에 입력 한 내용은 모델 (구성 요소에서 정의한 속성 패스 워드)을 업데이트합니다. 그런 다음 암호를 알려줍니다.