javascript - Angular JS有条件地将字符串附加到标签属性的最干净方法

Question

我有一个关于 angularJS 的新手问题：

我有两个<a>非常相似的标签，仅在设置href变量时才显示它们的依赖foo：

如果 foo == null：

<a ng-href="#/bar/{{col.slug}}">{{col.title}}</a>

别的

<a ng-href="#/{{foo}}/bar/{{col.slug}}">{{col.title}}</a>

foo正如您所看到的，除了在 url 开头附加的变量之外，这些标签几乎相同。

我知道有类似ng-showandng-hide或三元运算之ng-if类的命令。

如何以最干净的方式进行此操作？

谢谢！

Answer 1

您可以调节您的代码：

<a ng-href="#/{{ foo != null ? foo + '/' : ''}}bar/{{col.slug}}">{{col.title}}</a>

或者你可以使用 ngShow：

   <a ng-show="foo == null" ng-href="#/bar/{{col.slug}}">{{col.title}}</a>
   <a ng-show="foo != null" ng-href="#/{{foo}}/bar/{{col.slug}}">{{col.title}}</a>

我更喜欢内联条件，发现它更可红色

Answer 2

您发送到浏览器的数据越少越好。

 <a ng-href="#/{{ !!foo ? foo + '/' : '/'}}bar/{{col.slug}}">{{col.title}}