Can I clean up these ng-if statements in AngularJS templates?
我有一个angularjs以下模板。
1
2
3
4
5
6
7
8
9
10
11
| <tr>
<td ng-if="condition1">
Hello World
</td>
<td ng-if="condition2">
A
</td>
<td ng-if="condition3">
B
</td>
</tr> |
我可以简化或清洁或将这三ng-if语句？？？？？？？？
condition1，condition2和condition3mutually是独家的。然而，他们不单是基于小康的开关语句的表达不会工作？我可以使用一个IF-THEN结构-啊？
- 根据情况，ng-switch可能适用于您docs.angularjs.org/api/ng/directive/ngswitch
- 为了回应你的评论，我修改了这个问题。
- NG开关将完成这项工作。您只需要根据逻辑在控制器中定义一个属性，并在视图中使用它。这样，您就可以用控制器或服务中的逻辑替换视图中的逻辑。
- 好像你在这里回答了自己的问题。这些选项是互斥的，但基于不同的条件，这意味着部分或全部可以同时存在，因此不能组合成一个语句。
- 我的沮丧是似乎没有ng-else-if和ng-else。为什么不呢？？
- 我曾经为此写过一本书。它将显示其ngSelectFirstIf属性评估为truthy的第一个子元素。不幸的是，我从来没有找到提交请求的时间，现在我无法访问该代码。这只是说，您不是唯一缺少此功能的人：)
- 请参阅这个问题和所有选项的答案(顺便说一句，非常好)stackoverflow.com/q/1581278/870729了解"为什么不"，谁知道呢，但如果您可以调整思考if/else条件的方式，就没有必要了。if/else可以用两个ng-if语句来完成。if/elseif/else可以用ng-switch来完成。作为一个开发人员，长的if/else if/else语句通常不是最好的方法。
- 另外，角度的美在于你可以写自己的指令。如果您需要if/else，这个答案似乎引用了他们创建的一个指令，并且对您来说很容易合并：stackoverflow.com/a/26187174/870729
- 没有cale_b，if/else if/else不能用ng开关完成，如果这些分支上的条件关闭了不同的表达式。
如果它们是互斥的，那么是的，您可以简化条件2和条件3，并且只对两者使用一个条件(因为输出是相同的)。
编辑：根据您的更新，您可以这样简化逻辑：
1
2
3
4
5
6
7
8
| <tr>
<td ng-if="condition1">
Hello World
</td>
<td ng-if="condition2 || condition3">
{{condition2 ? 'A' : 'B'}}
</td> |
也可以使用NG开关。
- 对不起，我原来的问题有一个错误，我根据你的回答改正了。第二和第三分支的输出略有不同。
- @Saqibari：更新。
- 我的沮丧是似乎没有ng-else-if和ng-else。为什么不呢？？
- 要获得类似于if/else的行为，可以尝试使用"switch"：docs.angularjs.org/api/ng/directive/ng switch，并对else流使用ng开关默认值。