引导CSS没有得到在ngClass

我下面的代码行显示基于模式的类型模式的消息正确呈现 -引导CSS没有得到在ngClass

<div class="modal-body"> 
    <span class="fa sb-alert-icon" [ngClass]="{ 'fa-exclamation-circle text-danger': (type == error),'fa-exclamation-triangle text-warning': (type == alert) 
    ,'fa-question-circle text-warning': (type == confirm), 'fa-info-circle text-info': (type == info)}">{{message}}</span> 
</div>

问题是，我没有看到正确的文本颜色警报消息具有上述条件并呈现为白色。

在浏览器控制台我没有看到“文本警告”正在呈现。但我确实看到文字颜色设置为白色的地方，如下所示。

但是，如果我以上条件更改为以下 -

<span class="fa sb-alert-icon" [ngClass]="{ 'fa-exclamation-circle text-danger': (type == error),'fa-exclamation-triangle text-warning': (type == alert) 
    , 'fa-info-circle text-info': (type == info)}">{{message}}</span>

我见 '的文字警告' CSS得到正确应用，如下图所示。

这里CSS压倒一切不会发生。

编辑-1：

.sb警报，图标下面的代码 -

.sb-alert-icon{ 
    font-size: medium; 
    padding-right: 10px; 
}

不知道，如果这是因为发生了 -

对'Alert'012连续使用'text-warning'css'确认'方案。
同时使用Font Awesome和Bootstrap。

来源

2017-08-29 coder87

类型==错误，'error'是一个变量或一个字符串？ –

@LonYang - 错误是一个变量，而不是字符串。 – coder87

我找到了这个错误的原因。因为'text-warning'由'type == alert'和'type == confirm'控制，所以需要'type == alert && type == confirm'，你可以试试我的答案代码 –

<span class="fa sb-alert-icon" 
    [ngClass]="{ 
    'fa-exclamation-circle text-danger': type == error, 
    'fa-exclamation-triangle': type == alert, 
    'fa-info-circle text-info': type == info, 
    'fa-question-circle': type == confirm, 
    'text-warning': type == alert || type == confirm 
    }"> 
    {{ type }} - {{ message }} 
</span>

来源

2017-08-29 08:38:49

它的确行得通！谢谢：） – coder87

引导CSS没有得到在ngClass

回答

相关问题