Angularjs( 二 )

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/QuietHRH/article/details/83004414

js代码分层

JS和html都放在一起，并不利于我们后期的维护。我们可以在前端代码中也运用MVC的设计模式，将代码进行分离，提高程序的可维护性。

自定义服务

​ 在 AngularJS 中，服务是一个函数或对象，可在你的 AngularJS 应用中使用。其实我们也可以自己来定义服务，而服务会封装一些操作。我们在不同的控制器中可以调用同一个服务，这样服务的代码将会被重用。

控制器继承

有些功能是每个页面都有可能用到的，比如分页，复选等等，如果我们再开发另一个功能，还需要重复编写。怎么能让这些通用的功能只写一次呢？我们通过继承的方式来实现。

基础层(模块)

base.js 不分页的模块

var app = angular.module('hrh', []);	

base_pagination.js 分页的模块

var app = angular.module('hrh', ['pagination']);

服务层(Service)

//服务
app.service('brandService',function ($http) {
    //查询所有
    this.findAll=function () {
        return $http.get("../brand/findAll.do");
    }

    //分页查询
    this.findPage=function (page,rows) {
        return $http.get("../brand/findPage.do?page="+page+"&rows="+rows);
    }

    //分页条件查询
    this.search=function (page,rows,entity) {
        return $http.post("../brand/search.do?page="+page+"&rows="+rows,entity);
    }

    //查询某个品牌
    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.add=function (entity) {
        return $http.post("../brand/add.do",entity);
    }

    //修改
    this.update=function (entity) {
        return $http.post("../brand/update.do",entity);
    }
})

控制层(controller)

baseController 父类控制js 定义共性内容

//基本控制层 被继承
app.controller('baseController',function ($scope) {
    $scope.entity={};

    //重新加载列表
    $scope.reloadList=function () {
        $scope.search($scope.paginationConf.currentPage,
            $scope.paginationConf.itemsPerPage);
    }

    //分页控件配置
    $scope.paginationConf={
        currentPage:1,
        totalItems:0,
        itemsPerPage:10,
        perPageOptions:[10,20,30,40,50],
        onChange:function () {
            $scope.reloadList();
        }
    }

    //存储被选中的id
    $scope.selectIds=[];
    $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);
        }
    }


});

brandController.js 子类控制器js 做CURD

//控制器
app.controller("brandController",function ($scope,$controller,brandService) {
    $controller('baseController',{$scope:$scope});

    //查询所有
    $scope.findAll=function () {
        brandService.findAll().success(
            function (response) {
                $scope.list=response;
            }
        )
    }



    //查询分页品牌列表
    $scope.findPage=function (page,rows) {
        brandService.findPage(page,rows).success(
            function (response) {
                $scope.list=response.rows;
                $scope.paginationConf.totalItems=response.total;
            }
        )
    }

    //根据id获取品牌实体
    $scope.findOne=function (id) {
        brandService.findOne(id).success(
            function (response) {
                $scope.entity=response;
            })
    }

    //添加/修改 品牌
    $scope.save=function () {
        var method;
        if($scope.entity.id!=null){
            method=brandService.update($scope.entity);
        }else{
            method=brandService.add($scope.entity);
        }
        method.success(
            function (response){
                if(response.success){
                    $scope.reloadList();
                }else{
                    alert(response.message);
                }
            }
        )
    }


    //删除品牌
    $scope.dele=function () {
        brandService.dele($scope.selectIds).success(
            function (response) {
                if(response.success){
                    $scope.reloadList();

                }else{
                    alert(response.message);
                }
                $scope.selectIds=[];
            }
        )
    }

    //条件查询 搜索
    $scope.searchEntity={};
    $scope.search=function (page,rows) {
        brandService.search(page,rows,$scope.searchEntity).success(
            function (response) {
                $scope.paginationConf.totalItems=response.total;
                $scope.list=response.rows;
            }
        )
    }



})

逆向工程生成的dao条件查询

@Override
    public PageResult findPage(TbBrand brand,int pageNum, int pageSize) {
        PageHelper.startPage(pageNum,pageSize);

        //条件查询
        TbBrandExample example = new TbBrandExample();
        TbBrandExample.Criteria criteria = example.createCriteria();
        if(brand!=null){
            if(brand.getName()!=null&&brand.getName().length()>0){
                criteria.andNameLike("%"+brand.getName()+"%");
            }
            if(brand.getFirstChar()!=null&&brand.getFirstChar().length()>0){
                criteria.andFirstCharEqualTo(brand.getFirstChar());
            }
        }


        Page<TbBrand> page = (Page<TbBrand>) brandMapper.selectByExample(example);
        return new PageResult(page.getTotal(),page.getResult());
    }