无法在引号内使用 Angular 值。

12 浏览
0 Comments

无法在引号内使用 Angular 值。

为什么这个不起作用:


但是这个可以工作:


在上面的例子中,mnuClick()例程从未被调用,但在下面的例子中,它会被调用。当我进行“检查元素”时,一切看起来都很正常。

0
0 Comments

在AngularJS中使用ng-click指令时,有时会遇到一个问题,即在引号内无法使用Angular值。这意味着无法直接在引号内使用$scope中的变量或表达式。

例如,以下代码中的ng-click指令似乎应该可以正常工作:

ng-click="mnuClick(choice)"

我肯定曾经多次使用过类似的代码,但目前手头没有代码可以验证。

这个问题的原因是,ng-click指令中的引号内部被视为字符串,而不是Angular表达式。因此,如果我们要在引号内使用Angular的值,就会出现这个问题。

解决这个问题的方法是使用双花括号{{}}语法来包裹需要使用的Angular值。修改上述代码如下:

ng-click="mnuClick({{choice}})"

通过这种方式,我们将choice变量或表达式包裹在双花括号中,使其成为一个有效的Angular表达式。

这样,当ng-click指令触发时,Angular会解析双花括号中的表达式,并将其作为参数传递给mnuClick函数。

总结起来,无法在引号内使用Angular值的问题是因为ng-click指令中的引号被解析为字符串,而不是Angular表达式。要解决这个问题,我们可以使用双花括号语法将需要使用的Angular值包裹起来。这样,Angular会解析这些表达式,并将其作为参数传递给指定的函数。

0
0 Comments

在这个问题中,无法在引号内使用Angular值的原因是,通过在引号内使用{{choice}},你实际上是在告诉程序你想将字符串{{choice}}作为mnuClick函数的参数。但是,当使用xxx时,这是正确的,因此你需要在这里使用引号。但是,当使用{{choice}}时,你不想要那个字符串,而是希望该表达式被计算并将其结果(可能是一个字符串)作为参数传递 - 因此在这里不需要引号(甚至不需要花括号)。所以只需写成:

<a class="btn" ng-click="mnuClick(choice)">{{choice}}</a>

简而言之,一个情况下你处理的是一个解析为字符串的表达式,另一个情况下你直接处理的是一个字符串。因此有时不需要引号,有时需要引号。

如果你想了解更详细的关于何时使用花括号和何时不使用花括号的信息,请查看这个问题的答案Difference between double and single curly brace in angular JS?

希望对你有所帮助。

PS:在a标签的文本中,你需要使用双花括号,因为你不在AngularJS控制的代码块中 - 因此你必须将其标记为绑定,否则它将只是HTML中的文本。

0
0 Comments

问题出现的原因是在ng-click中使用了双引号将"choice"括起来,导致无法使用angular的值。解决方法是不使用花括号将"choice"括起来,而是直接写成如下形式:<a class="btn" ng-click="mnuClick(choice)">{{choice}}</a>

0