NG与ul li重复在angularjs中不正确

时间:2018-12-28 15:21:39

标签: javascript html angularjs

我正在使用angularjs,在这里我需要从数组中获取ul li值,我正在获取值,但没有以正确的方式获取。检查元素的正确方式是

<ul>
<li class="parent">Category1</li>
<li class="child">
<ul>
<li>one</li>
<li>two</li>
<li>three</li>
</ul>
</li>

<li class="parent">Category2</li>
<li class="child">
<ul>
<li>four</li>
<li>five</li>
<li>six</li>
</ul>
</li>
</ul>

这是下面的代码

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
<ul ng-repeat="item in items">
<li class="parent" ng-repeat="(key, val) in item">{{key}}</li>
<li ng-repeat="(key, val) in item" class="child">
<ul>
<li>{{val}}</li>
</ul>
</li>
</ul>
</div>

脚本

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
$scope.items = {"filter":{"Category1":{"value":["one","two","three"]},"Category2":{"value":["four","five","six"]}}}
console.log($scope.items.filter);
});

1 个答案:

答案 0 :(得分:0)

您可以尝试从数组中获取ul li值:

<ul ng-repeat="(x, y) in items.filter">
<li class="parent"><b>{{x}}</b></li>
<li class="child">
<ul>
<li ng-repeat="p in y.value">{{p}}</li>
</ul>
</li>
</ul>

柱塞:http://plnkr.co/edit/D8M1U81tVz3UuzjWathk?p=preview 希望对您有帮助!