应项目的不同所以菜单的层级也不固定，所以在这里我写了5层菜单，哈哈。首先是html代码。
//菜单html代码
<ul class="page-sidebar-menu"><li ng-repeat="menu in menus"><a ui-sref={{menu.router}} style="cursor: pointer" ng-click="getMenuName([menu])"><i class={{menu.class}}></i><span class="title">{{menu.name}}</span><span class={{menu.span}}></span></a><ul class="sub-menu"><li ng-repeat="child in menu.children"><a ui-sref="{{child.router}}" style="cursor: pointer" ng-click="getMenuName([menu,child])"><i class={{child.class}}></i> {{child.name}}<span class={{child.span}}></span></a><ul class="sub-menu"><li ng-repeat="third in child.thirds"><a ui-sref={{third.router}} style="cursor: pointer" ng-click="getMenuName([menu,child,third])"><i class="icon-cogs"></i> {{third.name}}<span class={{third.span}}></span></a><ul class="sub-menu"><li ng-repeat="four in third.fourth"><a ui-sref={{four.router}} style="cursor: pointer" ng-click="getMenuName([menu,child,third,four])"><i class={{four.class}}></i>{{four.name}}<span class={{four.span}}></span></a><ul class="sub-menu"><li ng-repeat="five in four.fifth"><a ui-sref={{five.router}} style="cursor: pointer" ng-click="getMenuName([menu,child,third,four,five])">{{five.name}}<span class={{five.span}}></span></a></li></ul></li></ul></li></ul></li></ul></li></ul>
//面包屑html代码
<div><ul class="breadcrumb"><li ng-repeat="breadcrumb in breadcrumbs"><i class="icon-home breadcrumb-home" ng-if="$index<=0"></i><a href="#" class="breadcrumb-text">{{breadcrumb.name}}</a><i class="icon-angle-right" ng-if="$index!=breadcrumbs.length-1"></i></li></ul></div>
在相对应控制菜单的controller里调用菜单数据，并完成页面面包屑的操作。
//获取菜单数据
$scope.getMenulist = function () {$http.get(ctx+"/app/common/menuList.json").success(function (data) {$scope.menus = data;$rootScope.menus = data;})};$scope.getMenulist()；
//面包屑
$scope.getMenuName = function (menuList) {/* [menu,child,third] */if (menuList.length > 0 && menuList[menuList.length - 1].router) {$rootScope.breadcrumbs = menuList;$scope.breadcrumbs = $rootScope.breadcrumbs;}};
