|
1.2.1 前端代码 （1）修改 itemCatService.js [AppleScript] 纯文本查看 复制代码 //根据上级 ID 查询下级列表
this.findByParentId=function(parentId){
return $http.get('../itemCat/findByParentId.do?parentId='+parentId);
}（2）修改 itemCatController.js [AppleScript] 纯文本查看 复制代码 //根据上级 ID 显示下级列表
$scope.findByParentId=function(parentId){ itemCatService.findByParentId(parentId).success(
function(response){
$scope.list=response;
}
);
}（3）修改 item_cat.html 引入 JS
[AppleScript] 纯文本查看 复制代码 <tr ng-repeat="entity in list">
<td><input type="checkbox" ></td>
<td>{{entity.id}}</td>
<td>{{entity.name}}</td>
<td>{{entity.typeId}}</td>
<td class="text-center">
<button type="button" class="btn bg-olive btn-xs"
ng-click="findByParentId(entity.id)">查询下级</button>
<button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal" >修改</button>
</td>
</tr>
1.2 面包屑导航 我们需要返回上级列表，需要通过点击面包屑来实现修改 itemCatController.js [AppleScript] 纯文本查看 复制代码 $scope.grade=1;//默认为 1 级
//设置级别
$scope.setGrade=function(value){
$scope.grade=value;
}
//读取列表
$scope.selectList=function(p_entity){[AppleScript] 纯文本查看 复制代码 if($scope.grade==1){//如果为 1 级
$scope.entity_1=null;
$scope.entity_2=null;
}
if($scope.grade==2){//如果为 2 级
$scope.entity_1=p_entity;
$scope.entity_2=null;
}
if($scope.grade==3){//如果为 3 级
$scope.entity_2=p_entity;
}
$scope.findByParentId(p_entity.id); //查询此级下级列表
}修改列表的查询下级按钮，设定级别值后 显示列表 [AppleScript] 纯文本查看 复制代码 <span ng-if="grade!=3">
<button type="button" class="btn bg-olive btn-xs"
ng-click="setGrade(grade+1);selectList(entity)">查询下级</button>
</span> 这里我们使用了 ng-if 指令，用于条件判断，当级别不等于 3 的时候才显示“查询下级”按钮 绑定面包屑： [AppleScript] 纯文本查看 复制代码 <ol class="breadcrumb">
<li><a href="#" ng-click="grade=1;selectList({id:0})">顶级分类列表</a></li>
<li><a href="#" ng-click="grade=2;selectList(entity_1)">{{entity_1.name}}</a></li>[AppleScript] 纯文本查看 复制代码 <li><a href="#" ng-click="grade=3;selectList(entity_2)">{{entity_2.name}}</a></li>
</ol>
| 
收藏
淘帖
踩
