应根据条件显示文字。一种情况,两种实现方式。
第一种方式:
<p ng-if="theType == 'type21'">Alert! Special type...</p>
<p ng-if="theType != 'type21'">Chill...</p>
第二种方式:
<p>{{theType == 'type21' ? 'Alert! Special type...' : 'Chill...'}}</p>
哪一个更好?各种方式的利弊?
答案 0 :(得分:0)
我认为ng-if
- 正如文档所解释的那样:
ngIf指令基于{expression}删除或重新创建DOM树的一部分。如果分配给ngIf的表达式求值为false值,则从DOM中删除该元素,否则将元素的克隆重新插入DOM中。
第二个只检查一次条件,但我认为DOM
效率更重要。
答案 1 :(得分:0)
对于像这样的简单案例,这只是一个偏好问题。
对于简单的表达式,我会选择第二个。这只是一个简单的表达,并没有表现出任何性能差异。如果您不希望theType
更改,您可以使用bindOnce
语法来阻止进一步评估 - 提高性能
{{::(theType == 'type21' ? 'Alert! Special type...' : 'Chill...')}}
请参阅fiddle,您可以删除::
对于更复杂的情况,我宁愿将插值移动到控制器并只使用{{textToShow}}
,我会留下ng-if
用于可以删除的指令,或者如果DOM结构必须改变(这里你只是更改<p>
内的文本,您不是要添加新的DOM元素)