查看实时代码:
到底如何正确遍历嵌套键值对并正确输出,如下所示?
我要的是一棵像这样的树
-touts -classes -col-12 -col-md-12 -col-lg-12
当前视图是:
touts {"classes":["col-12","col-md-12","col-lg-12"]}
JS:
var currentApp = angular.module('currentApp', []); currentApp.controller('ACtrl', function($scope){ $scope.templates = { 'touts' : [ { 'classes' : ['col-12', 'col-md-12', 'col-lg-12' ] } ] }; });
HTML:
<div ng-app="currentApp"> <div ng-controller="ACtrl"> <ul ng-repeat="(key, prop) in templates"> <li>{{key}}</li> <li> <ul ng-repeat="class in templates[key]"> <li>{{class}}</li> </ul> </li> </ul> </div> </div>
您非常接近,我更新了小提琴。http://jsfiddle.net/y9wj6/9/
<ul ng-repeat="(key, prop) in templates"> <li>{{key}}</li> <ul ng-repeat="val in prop"> <ul ng-repeat="(o, values) in val"> <li>{{o}}</li> <ul ng-repeat="i in values"> <li>{{i}}</li> </ul </ul> </ul> </ul>