由于原本的小弹框toast在极限操作的情况下会出现悬停不消失，所以我们自定义一个toast

html：

<div class="toast" *ngIf="showtoast">{{toastmessage}}</div>

css:

.toast {    z-index: 9000;    position: fixed;    width: 90%;    border-radius: 3px;    top: 50%;    left: 5%;    height: 3em;    line-height: 3em;    margin-top: -1.5em;    text-align: center;    background: rgba(0, 0, 0, 0.8);    color: #FFFFFF;    text-align: center;}

TS:

presentToast(msg) {    this.showtoast = true;    this.toastmessage = msg;    setTimeout(() => {        this.toastmessage = "";        this.showtoast = false;    }, 1000);}

用ngif控制toast是否显示

传进一个参数来动态绑定。

可能没啥难的，就是记录一下