Question

我有以下AngularJS结构

<li ng-repeat="content in contents">
  <img src="{{content.image_url}}" />
  <div class="title">{{content_title}}</div>
</li>

但是如果“content.image_url”为NULL或者它不存在，我不想显示IMG标记。像

这样的东西

{{#if content.image_url}}
  <img.....
{{/if}}

这是进行条件检查的handlebarjs方法。我怎样才能在AngularJS中实现这一目标？我需要一个指令吗？

Answer 1

使用ng-show：

<li ng-repeat="content in contents">
  <img ng-show="content.image_url != ''" src="{{content.image_url}}" />
  <div class="title">{{content_title}}</div>
</li>

此外，我会使用ng-src而不是src来避免在加载图片时控制台出错：

<li ng-repeat="content in contents">
  <img ng-show="content.image_url != ''" ng-src="{{content.image_url}}" />
  <div class="title">{{content_title}}</div>
</li>

AngularJS - 根据变量的值显示DOM元素

1 个答案: