angular - 清晰的隐藏警报计时器
问题描述
我正在尝试在 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.
解决方案
我可以解决这个... 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;
}
});
}
唯一的问题是...如果您快速插入或修改时间不会开始,也就是说,如果您在 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>
我该如何解决这个问题?
推荐阅读
- xml - 谷歌表格中的 importxml 功能不适用于特定网站
- amazon-web-services - AWS SWF - 活动客户端生成不起作用(Maven、IntelliJ)
- azure - 将多个 Azure Functions 角色分配给 ARM 模板中的同一存储帐户
- angular - 角度测试:缺少区域设置“XXX”的区域设置数据
- node.js - 如何编写等待 next() 的异步快速中间件
- c++ - TensorFlow GPU 内存配置文件
- r - 匹配 df2 中的 df1$col1 并将 df2$col1 中的输出值匹配到 df1$col2
- flutter - 如何让渐变和资产图像协同工作?
- python - 将单个数字添加到嵌套列表
- c# - C# - 将命名变量添加到数组并更改它们的原始值(不是副本!)