如果else语句在AngularJS模板中
我想在AngularJS模板中做一个条件。 我从Youtube API获取视频列表。 部分视频比例为16：9，部分视频比例为4：3。
我想创造一个这样的条件：
if video.yt$aspectRatio equals widescreen then
element's attr height="270px"
else
element's attr height="360px"
我使用ng-repeat迭代视频。 不知道该怎么处理这种情况：
Angularjs（版本低于1.1.5）不提供if/else功能。 以下是您想要实现的几个选项：
（ 如果您使用1.1.5版或更高版本，请跳到下面的更新（＃5） ）
1.三元操作符：
正如@Kirk在评论中所建议的那样，这样做最简单的方法是使用三元运算符，如下所示：
<span>{{isLarge ? 'video.large' : 'video.small'}}</span>
2. ng-switch指令：
可以使用类似下面的内容。
<div ng-switch on="video">
<div ng-switch-when="video.large">
<!-- code to render a large video block-->
</div>
<div ng-switch-default>
<!-- code to render the regular video block -->
</div>
</div>
3. ng-hide / ng-show指令
或者，您也可以使用ng-show/ng-hide但使用它会实际渲染大视频和小视频元素，然后隐藏符合ng-hide条件的视频并显示符合ng-show条件的视频。 因此，在每个页面上，您将实际呈现两个不同的元素。
4.另一个要考虑的选项是ng-class指令。
这可以如下使用。
<div ng-class="{large-video: video.large}">
<!-- video block goes here -->
</div>
如果video.large是真的，以上基本上会为div元素添加一个large-video css类。
更新：Angular 1.1.5引入了ngIf directive
5. ng-if指令：
在1.1.5以上的版本中，你可以使用ng-if指令。 如果表达式提供返回此将消除元件false并重新插入element在DOM如果表达式返回true 。 可以使用如下。
<div ng-if="video == video.large">
<!-- code to render a large video block-->
</div>
<div ng-if="video != video.large">
<!-- code to render the regular video block -->
</div>
在最新版本的Angular（自1.1.5开始）中，它们包含一个名为ngIf的条件指令。 它与ngShow和ngHide不同之处在于元素不隐藏，但根本不包含在DOM中。 它们对于创造成本昂贵但未被使用的组件非常有用：
<div ng-if="video == video.large">
<!-- code to render a large video block-->
</div>
<div ng-if="video != video.large">
<!-- code to render the regular video block -->
</div>
三元是做这件事最明显的方法。
<div>{{ConditionVar ? 'varIsTrue' : 'varIsFalse'}}</div>