templates - AngularJS 模板中的内联逻辑

Question

有没有办法在 AngularJS 的模板中编写内联逻辑。

我想做的是这样的：

<div ng-repeat="item in items">
    {{item.isValid ? 'Valid item' : 'Invalid Item'}}
</div>

Answer 1

您可以使用&&and ||，它最终会像三元运算符一样工作。

{{item.isValid && 'Valid' || 'Invalid' }}

编辑：Angular 在 1.1.5 中引入了三元运算符：

{{item.isValid ? 'Valid' : 'Invalid' }}

Answer 2

您可以使用 ng-show 插入一个跨度来显示您的条件文本

例子

<div ng-repeat="item in items">
    <span ng-show="item.isValid">
           Valid item
    </span>
    <span ng-show="!item.isValid">
           Invalid item
    </span> 
</div>

Answer 3

您不能在角度表达式中使用条件。而且，如果您的 div 内容很轻（只是文本），您可能需要使用 ng-bind （它还可以避免您使用额外的 span 元素）：

<div ng-repeat="item in items" ng-bind="{true: 'Valid item', false: 'Invalid item'}[item.isValid]"></div>