zoukankan      html  css  js  c++  java
  • AngularJS分层开发

    为了AngularJS的代码利于维护和复用,利用MVC的模式将代码分离,提高程序的灵活性及可维护性。

    1,前端基础层

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

    2,前端服务层

    //服务层
    app.service('demoService',function($http){
        //读取列表数据绑定到表单中
        this.findAll=function(){
            return $http.get('../demo/findAll.do');        
        }
        //其它方法........            
    });

    3,父控制器

    //基本控制层 
    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();//重新加载
            }
        };     
        //......
    });    

    4,前端控制层(继承父控制器(实际是与baseController共享$scope),可依赖注入demoService等service层)

    //品牌控制层 
    app.controller('demoController' ,function($scope,$controller,demoService){    
        $controller('baseController',{$scope:$scope});//继承    
        //读取列表数据绑定到表单中  
        $scope.findAll=function(){
            demoService.findAll().success(
                function(response){
                    $scope.list=response;
                }            
            );
        }    
        //其它方法........ 
    });    

    5,页面需要引用上面的所有js文件,并且需要注意顺序。

  • 相关阅读:
    mysql
    makefile
    KNN算法(k-nearest neighbor)
    时间序列
    python易错题之lambda 以及 for循环中内嵌函数
    python易错题之作用域
    html----不常见标签
    js----DOM对象(3
    js----DOM对象(事件)
    js----对象
  • 原文地址:https://www.cnblogs.com/blazeZzz/p/9477964.html
Copyright © 2011-2022 走看看