2.品牌列表的实现
2.1 需求分析
实现品牌列表的查询（不用分页和条件查询）效果如下：
2.2 前端代码2.2.1 拷贝资源
将“资源/静态原型/运营商管理后台”下的页面资源拷贝到 pinyougou-manager-web 下
其中 plugins 文件夹中包括了 angularJS 、bootstrap、JQuery 等常用前端库，我们将在项目中用到
2.2.2 引入 JS
修改 brand.html ，引入 JS
[AppleScript] 纯文本查看 复制代码
?
|
1
|
<script type="text/javascript" src="../plugins/angularjs/angular.min.js"></script>
|
2.1.1 编写 JS代码
[AppleScript] 纯文本查看 复制代码
?
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
|
var app=angular.module('pinyougou', []);//定义模块 app.controller('brandController' ,function($scope,$http){
//读取列表数据绑定到表单中
$scope.findAll=function(){
$http.get('../brand/findAll.do').success(
function(response){
$scope.list=response;
}
);
}
});
|
2.1.1 循环显示表格数据
[AppleScript] 纯文本查看 复制代码
?
|
01
02
03
04
05
06
07
08
09
10
11
12
13
14
15
16
17
18
19
20
21
|
<tbody>
<tr ng-repeat="entity in list">
<td><input type="checkbox" ></td>
<td>{{entity.id}}</td>
<td>{{entity.name}}</td>
<td>{{entity.firstChar}}</td>
<td class="text-center">
<button type="button" class="btn bg-olive btn-xs" data-toggle="modal" data-target="#editModal" >修改</button>
</td>
</tr>
</tbody>
|
相关文章：
-
2022-01-03
-
2022-01-11
-
2021-05-17
-
2021-10-24
-
2021-06-22
-
2021-09-25
-
2021-10-22
-
2021-09-10