3

ng-include我观察到，当我在指令中包含一个模板时ng-show，ng-hide它似乎不起作用。

注意：在 angularjs1.0.4和1.0.5

这个作品

template.html

<table ng-init="changeable = null">
  <tr ng-repeat="(key, item) in items" ng-click="changeable = key">
    <td>
      <span ng-show="changeable != key">{{item.name}}</span>
      <input ng-hide="changeable != key" ng-model="item.name">
    </td>
    <td>
      <button ng-click="changeable = null">OK</button>
    </td>
  </tr>
</table>

这不起作用

template.html

<div ng-include src="'/changeable_table.html'"></div>

changeable_table.html

<table ng-init="changeable = null">
  <tr ng-repeat="(key, item) in items" ng-click="changeable = key">
    <td>
      <span ng-show="changeable != key">{{item.name}}</span>
      <input ng-hide="changeable != key" ng-model="item.name">
    </td>
    <td>
      <button ng-click="changeable = null">OK</button>
    </td>
  </tr>
</table>

更新

过了一会儿github@pkozlowski-opensource给我一个 wiki 的链接，它很好地解释了为什么需要这个命名空间，它是作用域原型继承的细微差别

4

1 回答 1

6

你有两个问题：

  1. 不要忘记ng-repeat为每个条目创建一个新范围以及您执行此操作的方式，该changeable属性不会在所有这些范围之间共享。正确定义您的模型（示例）：

    <table ng-init="model = {}; model.changeable = null">

    并将所有引用更改changeable为model.changeable。

  2. on tr将ng-click覆盖ng-clickon 按钮（当您单击按钮时，您也会单击 tr）。将 tr 移动ng-click到跨度：

    <span ng-show="model.changeable != key" ng-click="model.changeable = key">{{item.name}}</span>

plunker： http ://plnkr.co/edit/TTAUsPhqSq2rkF47EtNL?p=preview

于 2013-02-27T01:07:22.500 回答