ng-repeat 仅适用于尖括号(“<>”)之外的变量 {{ x }}?

ng-repeat only works for variable {{ x }} outside of angle brackets ("<>")?

我是 angularJS 的新手。 当我尝试 ng-repeat 时,我在我的代码中发现了一个问题(如下所示)

<ul class="dropdown-menu" role="menu" ng-init="names=findDomains()">
<li><a style="cursor:pointer" ng-repeat="x in names" ng-click="selectDomain({{ x }})">{{ x }}</a></li>
</ul>

我的想法是在我的页面上有一个下拉菜单(例如名称为 "test")。单击时显示选择,选项显示为<li></li>中的内容。所有选项都由函数 findDomains() 作为集合返回,并由 ng-init 初始化。

When a particular option (content in <li></li>) is selected (e.g. with name "opt1"), the text of the drop-down menu is updated with the name of the option ("opt1" 替换 "test")。这是由函数 selectDomain()

实现的

由于显示的内容和调用 selectDomain() 的内容相同,我将两个 {{x}} 调用 ng-repeat,希望显示的相同选项调用 selectDomain()

但是,其他一切似乎都正常(findDomains()ng-repeat<a></a> 之外的第二个 {{x}}。但是<a></a>里面的{{x}}不能正常使用。单击选项时,下拉菜单名称不会更新。

但是 selectDomain() 函数很好,因为它可以很好地处理纯文本(例如 ng-click="selectDomain('opt1'))。

有指导吗?

Per Doc

ng-click needs an Expression to evaluate upon click

那里不需要使用插值ng-click 不应该使用 {{}} 插值指令,他们可以直接访问其中的范围变量。

ng-click="selectDomain(x)"

其实这很简单。我通过删除花括号并放置 ng-click="selectDomain(x)"

来实现它

将变量传递给在范围函数中注册时,不需要将其包装在{{}}中。

试试下面的代码,它会起作用:

<ul class="dropdown-menu" role="menu" ng-init="names=findDomains()">
  <li><a style="cursor:pointer" ng-repeat="x in names" ng-click="selectDomain(x)">{{ x }}</a></li>
</ul>

当您只想将变量值放入 HTML 时使用 {{x}}