在Angular中将父作用域的值传递给ng-repeat循环

Pass parent scope value into ng-repeat loop in Angular

本文关键字：值传 ng-repeat 循环 作用域 Angular      更新时间：2023-09-26

这应该是一个非常简单的问题，但我发现的所有解决方法都很复杂。我在模板中使用ng-repeat循环遍历对象数组，如下所示:

<div class="row-fluid" ng-repeat="message in messages.current|filter:'draft'"> 
    {{ message.subject }} ... {{ campaign.name }} ...
</div>

因为ng-repeat创建了一个新的作用域，所以来自控制器的"campaign"对象似乎无法访问。是否有任何方法(除了添加活动对象到我数组中的每个项目)获得该值?

你可以使用$parent

访问父作用域
<div class="row-fluid" ng-repeat="message in messages.current|filter:'draft'"> 
    {{ message.subject }} ... {{ $parent.campaign.name }} ...
</div>

这是一种不使用$parent的工作方式。它向上搜索嵌套的作用域来找到你正在使用的对象，无论它必须遍历多少作用域。

在包含列表的作用域中，可以将列表定义为属性的对象，如下所示:

$scope.obj = {};
$scope.obj.items = ['item1','item2','item3'];

然后让ng-repeat看起来像这样:

<div ng-repeat="item in obj.items | filter:'item3' track by $index">
    {{obj.items[ obj.items.indexOf(item) ]}}
</div>

(您需要使用obj.items[ obj.items.indexOf(item) ]而不是obj.items[ $index ]，因为$index是过滤数组的索引，而不是原始索引)

这样做的原因是，当obj在当前作用域中不存在时，当你试图访问它的属性时，Angular会在当前作用域中查找，而不是给你一个错误(如果你只是尝试了{{obj}}，它将是未定义的，Angular会很高兴不给你任何东西，而不是通过更高的作用域查找)。这是一个关于嵌套作用域的有用链接:http://www.angularjshub.com/examples/basics/nestedcontrollers/

在我的情况下，我需要track by $index，因为我有一个输入与ng-model绑定到数组中的一个项目，并且每当模型更新时，输入会模糊，因为我认为HTML正在被重新渲染。使用track by $index的结果是数组中具有相同值的项将被重复。如果你修改了其中的一个而不是第一个，奇怪的事情就会发生。也许你可以过滤唯一性来避免这种情况。

我对AngularJS比较陌生，所以如果有什么大的我错过了请评论。但这是可行的，所以我至少用了

另一种方法可能是将父作用域作为作用域变量传递给指令，即

<my-directive 
    md-parent-scope="this" 
    ng-repeat="item in items"></my-directive>

这有点乱，但是你可以更好地控制父元素是什么，并且可以传入任何东西。

相关文章：