Angular1.x 根据数据结构创建动态菜单无限嵌套循环--指令版

目标：根据数据生成动态菜单，希望可以根据判断是否有子集无限循环下去

菜单希望的样子是这样的：

菜单数据是这样的：

$scope.expanders = [{
    title: 'title1',
    link: 'xx/xx',
    child:[
     {
        title: 'child2',
        link: 'xx/xx'
      },
       {
        title: 'child3',
        link: 'xx/xx',
        child:[
            {
            title: 'child5',
            link: 'xx/xx'
          }
        ]
      }
    ]
  }, {
    title: 'title2',
    link: 'xx/xx'
  }, {
    title: 'title3',
    link: 'xx/xx'

  }];

那么下面贴下代码，主要是用指令无限递归实现的：

1.js

var myModule = angular.module('myApp', []);

myModule.controller('TestController', ['$rootScope', '$scope', function($rootScope, $scope) {
  $scope.expanders = [{
    title: 'title1',
    link: 'xx/xx',
    child:[
     {
        title: 'child2',
        link: 'xx/xx'
      },
       {
        title: 'child3',
        link: 'xx/xx',
        child:[
            {
            title: 'child5',
            link: 'xx/xx'
          }
        ]
      }
    ]
  }, {
    title: 'title2',
    link: 'xx/xx'
  }, {
    title: 'title3',
    link: 'xx/xx'
  }];
}]);

myModule.directive('accordion', function($compile) {
  return {
    restrict: 'EA',  
    replace:true,
    scope:{
      expander:'=',
      child:'='
    },
    template: "

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！