# 后台管理模板

**Repository Path**: fanday2022/backstage_management_template

## Basic Information

- **Project Name**: 后台管理模板
- **Description**: 后台管理页面的模板
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2018-06-11
- **Last Updated**: 2020-12-19

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

前端分页组件的使用:

1.引入分页组件js和css
```
<!-- 分页组件开始 -->
<script src="../plugins/angularjs/pagination.js"></script>
<link rel="stylesheet" href="../plugins/angularjs/pagination.css">
<!-- 分页组件结束 -->
```
2.构建app模块时引入pagination模块

```
var app=angular.module('pinyougou',['pagination']);//定义品优购模块
```


3.页面的表格下放置分页组件

```
 <!-- 分页 -->
<tm-pagination conf="paginationConf"></tm-pagination>
```


4.在brandController中添加如下代码
//重新加载列表 数据

```
$scope.reloadList=function(){
	 //切换页码  
$scope.findPage( $scope.paginationConf.currentPage, $scope.paginationConf.itemsPerPage);
}
//分页控件配置 
$scope.paginationConf = {
		 currentPage: 1,
		 totalItems: 10,
		 itemsPerPage: 10,
		 perPageOptions: [10, 20, 30, 40, 50],
		 onChange: function(){
		        	 $scope.reloadList();//重新加载
		 }
}; 
//分页
$scope.findPage=function(page,rows){	
	$http.get('../brand/findPage.do?page='+page+'&rows='+rows).success(
			function(response){
				$scope.list=response.rows;	
				$scope.paginationConf.totalItems=response.total;//更新总记录数
			}			
	);
}
```

select2的使用


（1）修改 type_template.html  引入JS

```
    <link rel="stylesheet" href="../plugins/select2/select2.css" />
    <link rel="stylesheet" href="../plugins/select2/select2-bootstrap.css" />
    <script src="../plugins/select2/select2.min.js" type="text/javascript"></script>
    <script type="text/javascript" src="../js/angular-select2.js">  </script>
```
（2）修改typeTemplateController.js  ，定义品牌列表数据

```
$scope.brandList={data:[{id:1,text:'联想'},{id:2,text:'华为'},{id:3,text:'小米'}]};//品牌列表
```
（3）在type_template.html 用select2组件实现多选下拉框

```
<input select2  select2-model="entity.brandIds" config="brandList" multiple placeholder="选择品牌（可多选）" class="form-control" type="text"/>		
multiple 表示可多选
Config用于配置数据来源
select2-model用于指定用户选择后提交的变量
```