2.品牌列表的实现

2.1 需求分析

实现品牌列表的查询（不用分页和条件查询）效果如下：

2.2 前端代码2.2.1 拷贝资源

将“资源/静态原型/运营商管理后台”下的页面资源拷贝到 pinyougou-manager-web 下

其中 plugins 文件夹中包括了 angularJS 、bootstrap、JQuery 等常用前端库，我们将在项目中用到

2.2.2 引入 JS

修改 brand.html ，引入 JS

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

<script  type="text/javascript"  src="../plugins/angularjs/angular.min.js"></script>

2.1.1 编写 JS代码

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

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] 纯文本查看 复制代码

<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>

2.品牌列表的实现

2.1 需求分析

实现品牌列表的查询（不用分页和条件查询）效果如下：

2.2 前端代码2.2.1 拷贝资源

将“资源/静态原型/运营商管理后台”下的页面资源拷贝到 pinyougou-manager-web 下

其中 plugins 文件夹中包括了 angularJS 、bootstrap、JQuery 等常用前端库，我们将在项目中用到

2.2.2 引入 JS

修改 brand.html ，引入 JS

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

<script  type="text/javascript"  src="../plugins/angularjs/angular.min.js"></script>

2.1.1 编写 JS代码

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

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] 纯文本查看 复制代码

<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>