Question

我在角项目中使用angular-2-flash-messages和角材料。在有角度的材料仪表板中使用它时似乎出现问题。

This的显示方式

这是我使用即时消息的方式

this.flashMessage.show('You have successfully logged in', {cssClass: 'alert-success', timeout: 50000});

我试图通过CSS将Flash消息的消息内容移到中心，但是它们不起作用。只有引导'alert-success'或'alert-danger'可以使用。

在github repository中的问题之一中，所有者回答了自定义CSS的问题，但所有尝试均失败。

如何使消息内容居中？

Answer 1

如何在HTML中心标签中显示Flash消息？

赞：

<center>
   <flash-messages></flash-messages>
</center>

但是您需要在父标记上应用引导程序样式

<div class="alert alert-success">
   <center>
      <flash-messages></flash-messages>
   </center>
</div>

和不要通过具有展示功能的CSS类。

Answer 2

<div [ngClass]="{alert:true, 
                 'alert-info': message.style=='alert-info',
                 'alert-danger': message.style=='alert-danger'
                 'alert-success': message.style=='alert-success'  ">
   <center>
      <flash-messages></flash-messages>
   </center>
</div>

// si usas bootsrap，普埃特斯德埃斯特和埃维拉恩维欧

this.flashMessage.show('You have successfully logged in', {cssClass: 'alert-success', timeout: 50000});
this.flashMessage.show('You have logged', {cssClass: 'alert-info', timeout: 50000});
this.flashMessage.show('error de login', {cssClass: 'alert-danger', timeout: 50000});

如何自定义Angular Flash消息

2 个答案: