Question

许多前端框架通过在其前面加上另一个类来封装CSS样式。

例如bootstrap：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>Voilà，我们的条件中不再有任何空格，并获得了批准。

现在有一些上下文。让我们尝试将此方法应用于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>

第一个问题：是否可以在条件查询中使用空格？如何？

第二个问题 ：（如果第一个问题不可行）我该如何解决前缀不再是静态的的情况（例如Font Awesome的情况）？

Answer 1

更新，我检查并使用空格很好。

所以

usable_list = list(range(1, 11))
primes = [2, 3, 5, 7]

for element in usable_list:
    if element in primes:
        usable_list.remove(element)
print(usable_list)

应该工作。

您也可以使用这种格式；

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

Answer 2

您按班上课：

${workspaceFolder}/dist/common/local-entry/local-entry.js

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

2 个答案: