Question

我收到了以下代码：

<div class="map" ng-controller="DealerMarkerListCtrl">
    <a ng-click="showdetails=!showdetails" href="#/dealer/{{marker.id}}" class="marker" style="left:{{marker.left}}px;top:{{marker.top}}px" ng-repeat="marker in dealer"></a>
</div>

和这个观点：

<div ng-show="showdetails" class="alldealermodal">    
    <div ng-view></div>
</div>

同样的“ng-show”内容正在使用ng-repeat之外的一个链接正常工作，但在此ng-repeat中它不起作用。
链接应打开叠加层。 ng-view也有效。

我错过了什么？

Answer 1

由于ngRepeat创建了新范围，因此showdetails之外引用的ng-repeat与重复showdetails中正在更新的ng-click不同}。

您可以看到this post了解更多详细信息，但新范围的一种方法是绑定到对象属性而不是基本类型。

This fiddle显示了与details.show而不是showdetails绑定的小示例：

$scope.details = { show: true };

Answer 2

“我错过了什么？”

正如@Gloopy已经提到的，你可能没有意识到ng-repeat会创建子范围（每个项目一个）。此外，了解JavaScript原型继承如何工作也是必要的，因为每个子范围都是原型继承自同一父范围，并且影响JavaScript在范围上查找（或创建）属性的方式。

请注意，许多Angular内置指令会创建子范围：ng-repeat，ng-include，ng-switch，ng-controller，指令（可以，但可能不会）。有关原型继承如何工作的更多信息，为什么在尝试绑定到基元时它是一个问题，以及它与Angular范围的关系，请参阅here。

要扩展@ Gloopy的答案，您还可以考虑另外两种选择：

在ng-repeat中使用$parent绑定到父范围属性（而不是创建子范围属性）：
<a ng-click="$parent.showdetails=!$parent.showdetails" ...
在父作用域上定义一个方法并调用它，从而也改变父作用域属性（而不是子作用域属性）：
<a ng-click="toggleDetails()" ...

AngularJS - ng-repeat和ng-show

2 个答案: