清晰的隐藏警报计时器答案

【问题标题】：Timer for hidden Alerts of clarity清晰的隐藏警报计时器
【发布时间】：2018-07-09 11:57:59
【问题描述】：

我试图在 2-3 秒内隐藏清晰的警报，但这段代码 t 不显示，我不明白。

 import { Observable} from 'rxjs/Rx';

 public timerAlert: boolean = false;

 ngOnInit() {
   let timer =  Observable.timer(2000, 3000);
        timer.subscribe( () => {
           this.timerAlert = true; --> with this line My alert doesn't show.
        });

    }

HTML

   <clr-alert  [(clrAlertClosed)]="timerAlert"  [clrAlertClosable]="false" [clrAlertType]="'alert-danger'" *ngIf="errorServer">
       <clr-alert-item>
           <span class="alert-text">
                 {{ this.myMessage.message }}
            </span>
        </clr-alert-item>
    </clr-alert>

[clrAlertClosable]="false" for hidde 'x' in Alert.
[(clrAlertClosed)]="timerAlert" with this, I should show or not the alert.

【问题讨论】：

所以你有一个警报，当页面加载时你会在 5 秒内关闭它们？这是你想要做的吗？
显示我的警报，然后 2-3 秒，隐藏警报。但是使用该代码，我的警报不会显示。
Observable.timer(2000, 3000) 将等待 2 秒，然后每 3 秒将 true 分配给 timerAlert。不确定我是否理解这个变量的作用[clrAlertClosable]="false"，但是否有可能不会关闭不可关闭的警报？
您是否遇到任何控制台错误？
没有，有时显示有时没有

标签： angular clarity

【解决方案1】：

我可以解决这个问题... 50%

 import { Observable } from 'rxjs/Rx';
  public timerAlert: boolean = false;

 ngOnInit() {
        let timer = Observable.timer(10, 8000);
        this.timerAlerts(timer);

    }

 private timerAlerts(timer) {
        timer.subscribe(() => {

            if (this.errorServer || this.confirmedServer) {
                this.timerAlert = true; // firstTrue
                this.timerAlert = false;
                this.errorServer = false;
                this.confirmedServer = false;
            }
        });
    }

唯一的问题是......如果你快速插入o修改时间不开始，也就是说，如果您在 7 秒内修改某些内容，则消息确认只需 1 秒 ...

html

 <clr-alert  [(clrAlertClosed)]="timerAlert"  [clrAlertClosable]="false" [clrAlertType]="'alert-danger'" *ngIf="errorServer">
       <clr-alert-item>
           <span class="alert-text">
                 {{ this.myMessage.message }}
            </span>
        </clr-alert-item>
    </clr-alert>

     <clr-alert  [(clrAlertClosed)]="timerAlert"  [clrAlertClosable]="false" [clrAlertType]="'alert-success'" *ngIf="confirmedServer">
         <clr-alert-item>
             <span class="alert-success">
                 {{ this.myMessage.message }}
             </span>
         </clr-alert-item>
    </clr-alert>

我该如何解决这个问题？

【讨论】：