ionic2를 사용하는 경고 메시지

Question

내가 등록 버튼을 클릭하면 regsuccess 페이지로 이동하는 모든 필드를 입력하면 모든 필수 필드를 채우는 것과 같은 메시지가 나타납니다.

하지만 ionic2 및 타이프 스크립트를 사용하여 경고와 같은 메시지를 표시하려고합니다.

HTML :

<button primary full (click)="register()" >Register</button> 
    <p>{{regMsg}}</p> 

.TS 파일 : 여기 ionic2 당신이 경고를 표시 할 수있는 방법입니다에

register(){ 
    var _this= this; 

    // this.submitAttempt = true; 

    if(!this.registrationForm.valid){ 
     _this.regMsg = "enter all required feilds"; 
    } 
    else { 
     console.log("success!") 
     console.log(this.registrationForm.value); 
     _this.navCtrl.setRoot(RegThankyouPage); 

    } 

Answer 1

당신이 사용할 수있는 Alert 구성 요소를 사용하여 경고를 표시하려면 :

import { AlertController } from 'ionic-angular'; 
export class RegistrationComponent{ 
    constructor(public alertController: AlertController) { 
    } 
    register(){ 
    if(!this.registrationForm.valid){ 
     let alert = this.alertController.create(); 
     alert.setTitle("Login Failed"); 
     alert.setSubTitle("Please fill-in all the fields"); 
     alert.addButton("Okay!"); 
    } 
    } 
} 

Answer 2

import { AlertController } from 'ionic-angular'; // import alert controller 

export class MyComponent { 

    regMsg: string; 

    constructor(public alertController: AlertController) {} 

    showErrorMsg(msg) { 
    let alert = this.alertCtrl.create({ 
     title: msg, 
     subTitle: '10% of battery remaining', 
     buttons: ['Dismiss'] 
    }); 
    alert.present(); 
    } 

    register(){ 
    if (!this.registrationForm.valid) { 
     this.regMsg = "enter all required feilds"; 
     console.log("form invalid"); 
     this.showErrorMsg(this.regMsg); 
    } else { 
     console.log("Valid form"); 
    } 
    } 

} 

Answer 3

<button primary full (click)="register()" >Register</button> 


********************************************** 

import { AlertController } from 'ionic-angular'; // import alert 
controller 

export class MyComponent { 


public alertCtrl: AlertController) {} 

    showError(msg : string) { 
    let alert = this.alertCtrl.create({ 
     title: 'Error', 
     subTitle: msg, 
     buttons: ['OK'] 
    }); 
    alert.present(); 
} 

register(){ 
    if (!this.registrationForm.valid) { 
      this.showError("enter all required fields"); 
    } else { 
      console.log("Valid form"); 
    } 
} 

}