Java之品优购课程讲义_day06（1）

商品录入【选择商品分类】
1.1 需求分析
在商品录入界面实现商品分类的选择（三级分类）效果如下：

当用户选择一级分类后，二级分类列表要相应更新，当用户选择二级分类后，三级列表要相应更新。

1.2 准备工作
（1）在 pinyougou-shop-web 工程中创建 ItemCatController.（可拷贝运营商后台的代码）

（2）创建 item_catService.js （可拷贝运营商后台的代码）
（3）修改 goodsController.js，引入 itemCatService

（4）修改 goods_edit.html，添加引用

<script  type="text/javascript"  src="../js/base.js"></script>

<script  type="text/javascript"  src="../js/service/goodsService.js"></script>

<script  type="text/javascript"  src="../js/service/itemCatService.js"></script>

<script  type="text/javascript"  src="../js/controller/baseController.js"></script>

<script  type="text/javascript"  src="../js/controller/goodsController.js"></script>

1.1 代码实现
1.1.1 一级分类下拉选择框
在 goodsController 增加代码

//读取一级分类

$scope.selectItemCat1List=function(){ itemCatService.findByParentId(0).success(
function(response){

$scope.itemCat1List=response;

}

);

}

页面加载调用该方法

修改 goods_edit.html 一级分类下拉选择框

<select class="form-control" ng-model="entity.goods.category1Id" ng-options="item.id as item.name for item in itemCat1List"></select>
ng-options 属性可以在表达式中使用数组或对象来自动生成一个 select 中的 option 列表。ng-options 与 ng-repeat 很相似，很多时候可以用 ng-repeat 来代替 ng-options。但是 ng-options 提供了一些好处，例如减少内存提高速度，以及提供选择框的选项来让用户选择。
运行效果如下：

转载于:https://blog.51cto.com/13517854/2161940