AngularJS分層(代碼分離)

1.頁面引入js

        

2.各個js

base.js

var app = angular.module("pinyougou",[]);

base_pagenation.js

var app = angular.module("pinyougou",["pagination"]);

baseController.js

app.controller("baseController",function($scope){
	//分頁控件配置 ,插件加載的時候onChange方法會自動執行一次
	$scope.paginationConf = {
		 currentPage: 1,//當前頁
		 totalItems: 10,//總記錄數
		 itemsPerPage: 10,//每頁記錄數
		 perPageOptions: [10, 20, 30, 40, 50],//分頁選項
		 onChange: function(){//頁碼變更函數
			 $scope.reloadList();
		 }
	}; 
	
	//刷新列表
	$scope.reloadList = function(){
		 $scope.search($scope.paginationConf.currentPage,$scope.paginationConf.itemsPerPage);
	}
	
	$scope.selectIds = [];//用戶勾選的id集合
	//更新選中的ids
	$scope.updateSelection = function($event,id){
		if($event.target.checked){
			$scope.selectIds.push(id);
		}else{
			var index = $scope.selectIds.indexOf(id);//查找值的位置
			$scope.selectIds.splice(index, 1);//參數:移除的位置,移除的個數
		}
	}
	//提取json字符串數據中某個屬性,返回拼接字符串,逗號分隔
	$scope.jsonToString = function(jsonString,key){
		var json = JSON.parse(jsonString);
		var value="";
		for (var i = 0; i < json.length; i++) {
			if(i>0){
				value += ",";
			}
			value += json[i][key];//var a = {"id":"1","text":"聯想"};  取屬性2中方式: a.id a['id']
		}
		return value;
	}
})

brandController.js

app.controller("brandController",function($scope,$http,$controller,brandService){
		
	$controller("baseController",{$scope:$scope});
	
		//查詢品牌列表數據
		$scope.findAll = function(){
			brandService.findAll().success(
					function(response){
						$scope.list = response;
					}
			)
		}
		
		
		//分頁
		$scope.findPage = function(page,size){
			brandService.findPage(page,size).success(function(response){
				$scope.list = response.rows;//顯示當前頁數據
				$scope.paginationConf.totalItems = response.total;//更改總記錄數
			});
		}
		
		//新增
		$scope.save = function(){
			var object = null;//方法名
			if($scope.entity.id != null){
				object = brandService.update($scope.entity);
			}else{
				object = brandService.add($scope.entity);
			}
			object.success(function(res){
				if(res.success){
					$scope.reloadList();
				}else{
					alert(res.message);
				}
			})
		}
		
		//查詢實體
		$scope.findOne = function(id){
			brandService.findOne(id).success(function(res){
				$scope.entity = res;//顯示當前頁數據
			});
		}
		
		
		//刪除
		$scope.dele = function(){
			brandService.dele($scope.selectIds).success(function(res){
				if(res.success){
					$scope.reloadList();
					$scope.selectIds = [];//重置
				}else{
					alert(res.message);
				}
			});
		}
		
		$scope.searchEntity = {};
		//條件查詢
		$scope.search = function(page,size){
			//注意此處的傳參
			brandService.search(page,size,$scope.searchEntity).success(function(res){
				$scope.list = res.rows;//顯示當前頁數據
				$scope.paginationConf.totalItems = res.total;//更改總記錄數
			});
		}
		
		
	});

brandService.js

//品牌服務
app.service("brandService",function($http){
	this.findAll = function(){
		return $http.get("/brand/findAll.do");
	}
	this.findPage = function(page,size){
		return $http.get("/brand/findPage.do?page="+page+"&size="+size);
	}
	this.findOne = function(id){
		return $http.get("/brand/findOne.do?id="+id);
	}
	this.dele = function(ids){
		return $http.get("/brand/delete.do?ids="+ids);
	}
	this.search = function(page,size,searchEntity){
		return $http.post("/brand/search.do?page="+page+"&size="+size, searchEntity);
	}
	this.add = function(entity){
		return $http.post("/brand/add.do",entity);
	}
	this.update = function(entity){
		return $http.post("/brand/update.do",entity);
	}
	//下拉列表數據
	this.selectOptionList = function(){
		return $http.get("/brand/selectOptionList.do");
	}
})

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章