AngularJS:(ng-)隐藏元素但不隐藏其子元素

Question

如何创建一个类似于 ng-show 的指令来隐藏元素而不是子元素？

我在想url变量是否存在 Angular 模板

<a ng-show-link="url" ng-href="{{url}}">
  <img ng-src="picture.png" />
</a>

打印出来

<a href="/url">
  <img src="picture.png" />
</a>

，如果 url 不存在

<img src="picture.png" />

。与 ng-repeat 一起使用时将有助于删除额外的容器元素。

Answer 1

我认为拥有 <img> 会更容易标签，然后编写一条指令，用 <a> 包裹它。标记是否存在 url。添加/包装比删除现有标签更干净。

尽管您认为有一点冗余，但您也可以在没有指令的情况下执行此操作:

<a ng-show="url" ng-href="{{url}}"><img src="picture.png" /></a>
<img ng-hide="url" src="picture.png" />