角7 - 多类（空格）导致ngClass失败

Question

很多前端框架，通过与其他类前缀它封装了CSS样式。

如引导：btn btn-primary其中btn是前缀。

如果我在[ngClass]有条件地应用此，角将打破：

<div [ngClass]="{'btn btn-primary': booleanVar, 'btn btn-danger': !booleanVar}"></div>

然而，这将很容易被提取共同类定名这样解决的：

<div class="btn" [ngClass]="{'btn-primary': booleanVar, 'btn-danger': !booleanVar}"></div>瞧，我们不再有任何空间在我们的条件，和角批准。

现在有一些背景。让我们尝试应用此方法Font Awesome，其前缀可以发现here。

Style       Prefix  Example 
Solid       fas     <i class="fas fa-igloo"></i>    
Regular     far     <i class="far fa-igloo"></i>    
Light       fal     <i class="fal fa-igloo"></i>    
Brands      fab     <i class="fab fa-font-awesome"></i> 

第一个问题：是否可以使用空格在条件查询？怎么样？

第二个问题：（1如果问题是不可能的），我将如何解决的情况下，前缀不再是静态的（如在字体的情况下，真棒）？

Answer 1

您可以通过班级做类：

[ngClass]="{'btn': true, 'btn-primary': booleanVar, 'btn-danger': !booleanVar}"

Answer 2

更新，我检查，并使用空格是罚款。

所以这

<div [ngClass]="{'btn btn-primary': booleanVar, 'btn btn-danger': !booleanVar}></div>

应该管用。

你也可以使用这种格式;

[ngClass]="booleanVar ? 'btn-primary': 'btn-danger'"