Question

我正在编辑已存在的Angular网页。在app.js文件中，每个页面都有多个控制器。这是他们的模板：

JS：

app.controller("myCtrl", function($scope) {
$scope.useSettings({
Header: "header",
Title: "title",
mainImg: "main.png",
fields: [{
  fieldText: "text",
},{
  fieldImg: "pic.jpg",
},{
  fieldAccordion:
 // 
},{
]
});
});

我的目标是让fieldAccordion作为我输入的数据的手风琴，以及我的所有字段的工作原理。

这是我在html文件中的无序列表数据类型：

<div class="basic-page__field__undordered" ng-
if="field.fieldUnorderedList">
<ul class="field-list field-list--unordered">
<li ng-repeat="listItem in field.fieldUnorderedList">{{ listItem }}
</li>
</ul>
</div>

我可以在.JS文件中使用它，如下所示： fieldUnorderedList：[ “物品1”， “ITEM2” ]

所以我想找到一种类似的方法来使用手风琴类型的数据。

以下是我在.html文件中的写法：

<div class="basic-page__field__accordion" ng-if="field.fieldAccordion">
<ul class="field-list field-list--accordion">
<li ng-repeat="item in items" ng-click="accordion.current = item.name">
{{item.name}}
<ul ng-show="accordion.current == item.name">
<li ng-repeat="sub in item.sub">{{sub.name}}</li>
</ul>
</li>
</ul>
</div>

现在我遇到的问题就是让它像使用一样简单 “fieldAccordion：”在我的控制器中。

我做了一些研究，我不明白的是：我的所有控制器都有与$ scope.useSettings相同的模板，后跟所有数据，如fieldText，fieldImg等。

我如何添加另一个处理手风琴数据类型的$范围，我可以在我想要的确切位置使用它？

这样的事情：

$scope.accordion = {
current: null
};

$scope.items = [{
name: 'List 1',
sub: [{
name: 'Sub 1.1'
},{
name: 'Sub 1.2'
}]
},{
name: 'List 2',
sub: [{
name: 'Sub 2.1'
}]
},{
name: 'List 3',
sub: [{
name: 'Sub 3.1'
},{
name: 'Sub 3.2'
},{
name: 'Sub 3.3'
}]
}];
}]);

这是我理解AngularJS的最大障碍之一。由于我正在处理现有的网页，因此我不知道如何为一个控制器添加多个$ scope以及在何处使用它们。任何帮助表示赞赏。

在AngularJS中实现手风琴并更好地理解范围

0 个答案: