我有一个ng-repeat,它实际上可以根据用户的操作在其内部的ng-repeats中嵌套无限数量。基本上,他们可以创建更多项目,然后允许您根据需要在该项目中创建更多项目。
现在的问题是,我需要能够访问$scope.pageId
内的每个项目,以便我可以执行ng-if仅显示某些内容,具体取决于pageId。
目前$parent.pageId
可以使用,但仅适用于第一项。当然,下一个嵌套项的父级将是第一个项而不是scope.page
我是否有办法将scope.pageId
传递到Item的每个嵌套ng-repeat中,因为它们在$parent
方面远离范围?
答案 0 :(得分:1)
您可以在控制器中的任何位置访问范围的变量,包括嵌套的ng-repeat
:
var myApp = angular.module('myApp', []);
myApp.controller('MyCtrl', ['$scope', function($scope) {
$scope.name = 'Mistalis';
$scope.complexArray = [
[
[
[{
'value': 123456
}]
]
]
];
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp">
<div ng-controller="MyCtrl">
<div ng-repeat="i in complexArray">
<div ng-repeat="j in i">
<div ng-repeat="k in j">
<div ng-repeat="l in k">
{{l.value}}
<br/>My name is {{name}}!
</div>
</div>
</div>
</div>
</div>
</div>
&#13;
答案 1 :(得分:0)
通常的做法是定义一个服务来保存您想要访问的数据,并在显示它的元素上使用控制器。控制器将查询服务并使视图可访问数据。
angular.module('MyApp')
.factory('SectionNamePageIdService', [
function() {
return {
setPageId: function() { ... },
getPageId: function() { ... )
};
}
]);
angular.module('myApp')
.directive('NestedItems', ['SectionNamePageIdService',
function('SectionNamePageIdService') {
return {
restrict: 'E',
scope: true,
template: '<div ng-repeat="item in nestedItems"></div>',
controller: ['$scope', function($scope) {
$scope.pageId = SectionNamePageIdService.getPageId();
}]
};
}
]);
该示例假定您在父作用域中有一个nestedItems
对象。您可能还需要定义一个单独的NestedItem
指令来处理每个项目的显示方式。我不知道你打算如何将数据传递给嵌套项目,所以这只是一个基本的例子。您可能还想为数据定义服务。
然而,看看你的评论,我真的怀疑这样的嵌套是好的设计。从用户体验的角度来看,深度嵌套(20级!)对我来说似乎很笨重。因此,在尝试寻找技术解决方案之前,最好先在概念层面上修改问题。