我想在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迭代视频。对于这种情况,我不知道该怎么做:

在作用域中添加函数? 它在模板?


当前回答

在这种情况下,您希望根据对象属性“计算”像素值。

我会在控制器中定义一个函数来计算像素值。

在控制器中:


$scope.GetHeight = function(aspect) {
   if(bla bla bla) return 270;
   return 360;
}

然后在模板中写:


element height="{{ GetHeight(aspect) }}px "

其他回答

    <div ng-if="modeldate==''"><span ng-message="required" class="change">Date is required</span> </div>

你可以像上面一样使用ng-if指令。

在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>

ng If else语句

ng-if="receiptData.cart == undefined ? close(): '' ;"

Angular的一个可能性是: 我必须在html部分中包含一个if -语句,我必须检查我产生的URL的所有变量是否都是定义的。我用了下面的方法,这似乎是一种灵活的方法。我希望这对某些人有所帮助。

模板中的html部分:

    <div  *ngFor="let p of poemsInGrid; let i = index" >
        <a [routerLink]="produceFassungsLink(p[0],p[3])" routerLinkActive="active">
    </div>

以及typescript部分:

  produceFassungsLink(titel: string, iri: string) {
      if(titel !== undefined && iri !== undefined) {
         return titel.split('/')[0] + '---' + iri.split('raeber/')[1];
      } else {
         return 'Linkinformation has not arrived yet';
      }
  }

谢谢并致以最良好的问候。

Jan

Angular本身并没有提供if/else功能,但你可以通过包含以下模块来获得:

https://github.com/zachsnow/ng-elif

用它自己的话来说,它只是“一个控制流指令的简单集合:ng-if、ng-else-if和ng-else。”使用起来简单直观。

例子:

<div ng-if="someCondition">
    ...
</div>
<div ng-else-if="someOtherCondition">
    ...
</div>
<div ng-else>
    ...
</div>