Есть класс HeaderComponent.
У него есть метод login, который вызывается при клике на кнопку, и через promise вызывает другой метод этого класса - successLogin() :
login(name, pass){
this.serverService.loginUser(name, pass)
.then(
res => {
console.log(res);
this.successLogin();
},
error => {
console.log(`Rejected: ${error}`);
this.failureLogin();
}
)
}
successLogin() меняет пару свойств:
successLogin(){
this.popUpVisible = false;
this.isLogin = true;
console.log(this); // все свойства обновлены, все ок.
}
В HTML есть элементы которые используют ngIf :
<div *ngIf="isLogin" class="newSeat">New seat</div>
<div *ngIf="!isLogin" (click)="toggleLoginPopUpVisibility()" class="login">LOGIN</div>
<div *ngIf="isLogin" (click)="logout()" class="logout">LOGOUT</div>
<div *ngIf="popUpVisible" class="loginPopUp"></div>
Суть бага:
Иногда всё адекватно пропадает/появляется как и должно работать. А иногда изменения в классе происходит (вижу это через console.log(this)), но ngIf ничего не делает. Свойства изменены, но то что должно быть скрыто - никак не реагирует. Рандом полный, когда захочет - сработает, нет - нет.