Углы 2 оповещения отображаются только один раз

Question

У меня есть угловой компонент забытого пароля. Компонент просит сервер генерировать код подтверждения 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> 

Answer 1

Вы должны сбросить activeVerificationCodeSent ложь после диалога получить отклонены. Я ожидаю, что <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; 
}