2017-02-15 112 views
2

我有一個角2忘記密碼組件。該組件要求服務器生成SMS驗證碼並在發送SMS消息時提醒用戶。 收到服務響應後,會顯示一條提示,說明使用*ngIf將代碼交付給用戶的手機。Angular 2警報只顯示一次

但是,當用戶要求第二個代碼時,不會彈出警報(ng2-bootstrap)。

任何幫助表示感謝。

@Component({  
    templateUrl:'forgot-password.component.html', 
    styleUrls:['../../res/styles/login.component.css'], 
    providers:[{provide:AlertConfig, useFactory:getAlertConfig}] 

}) 
export class ForgotPasswordComponent implements OnInit{ 


    model:any={}; 
    returnUrl:string; 
    smsCodeResponse:SMSVerificationInfo; 
    errorMessage:string; 
    activeVerificationCodeSent:boolean; 
    constructor(
     private route:ActivatedRoute, 
     private router:Router, 
     private authenticationService:AuthenticationService 
    ){} 


    requestVerificationCode(){ 
     this.authenticationService.requestSMSCode(this.model.username) 
     .subscribe(
      (s)=>this.smsCodeResponse=s, 
      (e)=>this.errorMessage=e, 
     ()=> { 
       this.activeVerificationCodeSent=this.smsCodeResponse.aktifmi) 
      };    
    } 

} 

模板

<div *ngIf="activeVerificationCodeSent"> 
    <alert type="danger" dismissible="true"> 
     <strong>Bilgi</strong> Doğrulama Kodu telefonunuza gonderildi. 
    </alert> 
</div> 
+0

,使之成爲可讀請格式化你的代碼... – bergben

+1

@bergben這是一個刺在我的眼中:D – PierreDuc

回答

1

你應該對話框後activeVerificationCodeSent重置爲false被擱置了。我預計<alert>被解僱,但你不重置狀態。你應該做這樣的事您的模板中:

<div *ngIf="activeVerificationCodeSent">** 
    <alert type="danger" [dismissible]="true" (onClose)="onAlertClose()"> 
     <strong>Bilgi</strong> Doğrulama Kodu telefonunuza gonderildi. 
    </alert> 
</div> 

而且在添加功能時,您ForgotPasswordComponent

onAlertClose(): void { 
    this.activeVerificationCodeSent = false; 
} 
+0

嘗試過解決方案。它的工作原理。 – desperado06