Предупреждение Angular 2 отображается только один раз

У меня есть компонент angular 2 для забытого пароля. Компонент запрашивает у сервера генерацию SMS-кода подтверждения и оповещает пользователя об отправке SMS-сообщения. После получения ответа службы отображается оповещение о том, что код доставлен на мобильный телефон пользователя с помощью *ngIf.

Однако когда пользователь запрашивает второй код, предупреждение (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>

angular ng2-bootstrap
person desperado06    schedule 15.02.2017    source источник
comment
Пожалуйста, отформатируйте код, чтобы он стал читабельным...   -  person bergben    schedule 15.02.2017
comment
@bergben это тоже было бельмом на глазу :D   -  person Poul Kruijt    schedule 15.02.2017

Ответы (1)


arrow_upward
1
arrow_downward

Вы должны сбросить 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;
}
person Poul Kruijt    schedule 15.02.2017