javascript - ng-click="currentTpl='/inventory.html'" Inside ng-repeat not working

Question

I have a menu list, in which when I do ng-repeat , it is not working, but without ng-repeat it is working.

<div class="reports_header_tabs_holder">
      <span ng-repeat="tab in filters.tabs" ng-class="{'active_tab': tab.href == filters.activeTab }">
      <a ng-click="currentTpl='/{{tab.href}}.html'" >{{tab.title}}</a>
      </span>

Viewability optimization inventory

Fiddle

Please read the comment and try accordingly,

<!-- if you comment the ng-repeat anchor, above line ( <a ng-click="currentTpl='/{{tab.href}}.html'" >{{tab.title}}</a> ), and uncomment the below anchors, it works, -->

Answer 1

问题是ngRepeat为每次迭代创建单独的范围。这意味着单击您正在设置子范围属性的链接currentTpl，这不会影响父范围属性。最简单的解决方法是直接引用父范围变量：

<span ng-repeat="tab in tabs">
     <a ng-click="$parent.currentTpl = '/' + tab.href + '.html'" >{{tab.title}}</a>
</span>

另一个问题是你不应该{{在里面使用插值标签ngClick，因为这是一个表达式，你不必插值tab.href来获得它的值。

演示：http: //jsfiddle.net/nLC3g/255/