angularjs麵包屑導航
阿新 • • 發佈:2018-11-10
angularjs麵包屑導航
頁面顯示
<li> //點選促發setGrade();將0賦值給grade,此時grade=0;$scope.grade=2; <a href="#" ng-click="setGrade(0,null);findParentId(0)" >頂級分類列表</a> </li> <li> //點選促發setGrade();將1賦值給grade,此時grade=1;$scope.grade=3; <a href="#" ng-click="setGrade(1,cat_1);findParentId(cat_1.id)">{{cat_1.name}}</a> </li> <li> //點選促發setGrade();將2賦值給grade,此時grade=2;$scope.grade=4; <a href="#" ng-click="setGrade(2,cat_2);findParentId(cat_2.id)">{{cat_2.name}}</a> </li> <tbody> <tr ng-repeat="category in list"> <td><input type="checkbox" ></td> <td>{{category.parentId}}</td> <td>{{category.name}}</td> <td> {{category.typeId}} </td> <td class="text-center"> //grade是angularjs的grade,當到第二層就隱藏該按鈕 //點選查詢下級時將該tr的資料傳入方法 <span ng-if="grade<3"> <button type="button" class="btn bg-olive btn-xs" ng- click="setGrade(grade,category);findParentId(category.id)">查詢下級</button> </span> <button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal" >修改</button> </td> </tr> </tbody>
Controller.js
$scope.findParentId=function(id){ $http.get('/findParentId?id='+id).success(function(response){ $scope.list=response; }); } //定義等級 該grade是angularjs的grade,只是為了記錄層數 $scope.grade=1; //引數grade是普通引數 //category是點選的每一行資料 $scope.setGrade=function(grade,category){ //angularjs的grade記錄一層 $scope.grade=grade+1; if(grade==0){ $scope.cat_1=null; $scope.cat_2=null; } if(grade==1){ $scope.cat_1=category; $scope.cat_2=null; } if(grade==2){ $scope.cat_2=category; } }