|
【郑州校区】品优购电商系统开发第 3 章规格及模板管理 二
2.控制器继承
2.1 需求分析
有些功能是每个页面都有可能用到的，比如分页，复选等等，如果我们再开发另一个功能，还需要重复编写。怎么能让这些通用的功能只写一次呢？我们通过继承的方式来实现。
2.2 前端代码
2.2.1 建立父控制器
在 pinyougou-manager-web 的 js/controller 目录下建立 baseController.js
[AppleScript] 纯文本查看 复制代码 //基本控制层
app.controller('baseController' ,function($scope){
//重新加载列表 数据
$scope.reloadList=function(){
//切换页码
$scope.search( $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.selectIds=[];//选中的 ID 集合
//更新复选
$scope.updateSelection = function($event, id) {
if($event.target.checked){//如果是被选中,则增加到数组
$scope.selectIds.push( id);
}else{
var idx = $scope.selectIds.indexOf(id);
$scope.selectIds.splice(idx, 1);//删除
}
}
});
2.2.2 修改品牌控制器层
[AppleScript] 纯文本查看 复制代码 修改 brandController.js
//品牌控制层
app.controller('brandController' ,function($scope,$controller,brandService){
$controller('baseController',{$scope:$scope});//继承
//读取列表数据绑定到表单中
$scope.findAll=function(){
brandService.findAll().success(
function(response){
$scope.list=response;
}
);
}
//其它方法省略........
});
$controller 也是 angular 提供的一个服务，可以实现伪继承，实际上就是与 BaseController 共享$scope
| 
收藏
淘帖
踩
