黑马程序员技术交流社区

标题: 【郑州校区】品优购电商系统开发第 7 章二 [打印本页]

作者: 我是楠楠 时间: 2020-5-26 14:58
标题: 【郑州校区】品优购电商系统开发第 7 章二

【郑州校区】品优购电商系统开发第 7 章二

1.3 显示状态
修改 goodsController.js，添加 state 数组

[AppleScript] 纯文本查看 复制代码

$scope.status=['未审核','已审核','审核未通过','关闭'];//商品状态

修改列表显示

[AppleScript] 纯文本查看 复制代码

{{status[entity.auditStatus]}}

显示效果如下：

1.4 显示分类

我们现在的列表中的分类仍然显示 ID
如何才能显示分类的名称呢？
方案一：在后端代码写关联查询语句，返回的数据中直接有分类名称。
方案二：在前端代码用 ID 去查询后端，异步返回商品分类名称。
我们目前采用方案二：
（1）修改 goodsController

[AppleScript] 纯文本查看 复制代码

$scope.itemCatList=[];//商品分类列表

//加载商品分类列表

$scope.findItemCatList=function(){

itemCatService.findAll().success(

function(response){

for(var i=0;i<response.length;i++){

$scope.itemCatList[response.id]=response.name;

}

}

);

}

代码解释：因为我们需要根据分类 ID 得到分类名称，所以我们将返回的分页结果以数组形式再次封装。
（2）修改 goods.html ,增加初始化调用

[AppleScript] 纯文本查看 复制代码
<body
class="hold-transition skin-red sidebar-mini"
ng-app="pinyougou"
ng-controller="goodsController" ng-init="findItemCatList()">

（3）修改 goods.html , 修改列表

[AppleScript] 纯文本查看 复制代码
<td>{{itemCatList[entity.category1Id]}}</td>
<td>{{itemCatList[entity.category2Id]}}</td>
<td>{{itemCatList[entity.category3Id]}}</td>

1.5 条件查询
根据状态和商品名称进行查询
修改 goods.html

[AppleScript] 纯文本查看 复制代码
<div class="has-feedback">
状态：<select ng-model="searchEntity.auditStatus">
<option value="">全部</option>
<option value="0">未审核</option>
<option value="1">已审核</option>
<option value="2">审核未通过</option>
<option value="3">关闭</option>
</select>
商品名称：<input ng-model="searchEntity.goodsName">
<button class="btn btn-default" ng-click="reloadList()">查询</button>
</div>

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2