为什么指令ng-href需要{{}}而其他指令不需要{{}}？

Question

我只是想知道为什么我需要为ng-href添加双花括号而其他一些指令不需要它们？

<a ng-href="{{myScopeVar}}" ng-if="myScopeVar">link</a>

请注意,ng-href需要括号而不需要ng-if.

Answer 1

我对你的问题不太确定.但我认为你想知道为什么在angular指令中有不同的语法风格.首先,请看一下这篇文章:角度JS中双重和单个花括号的区别？答案解释了它们之间的区别{{}},{}没有大括号.

对于您的具体示例,如在文档中所述:ng-href需要一个模板(任何可以包含{{}}标记的字符串),而ng-if需要一个表达式 - 例如,您可能不会写{{}},因为angular会对其进行评估.

如果你看一下角来源,你会看到,ng-href使用attr.$observe而NG-如果使用的$scope.$watch功能.每次更改属性值时都会调用$ observe.当表达式产生新值时,将调用$ watch.

但为什么这两种方式不同呢？我认为有一点是更容易使用和代码可读性.现在你可以写:

<a ng-href="http://yourdomain.com/users/{{userId}}/post/{{postId}}">title</a>

如您所见,您只为动态插入userId和postId值编写表达式.如果ng-href还要使用$watch我们必须编写的函数(不要这样做因为它不起作用 - 它只能说明不同之处):

<a ng-href="'http://yourdomain.com/users/'+userId+'/post'+postId">title</a>