AngularJS中controller控制器继承的使用方法

// 参数的解释
// constructor 可以是 function 也可以是 string 
//      如果传入一个 function, 就会当成 controller 的构造函数
//      如果传入一个 string，就会根据字符串去$controllerProvider 找 注册的 controller
//locals 是一个对象，注入来自局部的 controller ,在这里我们认为 child controller
$controller(constructor, locals, [bindings])

myApp.controller("ParentCtrl", function($scope){
  $scope.name = "darren";
})

myApp.controller("ChildCtrl", function($scope){

})


  父控制器中的name变量值 
  

     子控制器中的name变量值 
     
     

      
child controller name: {{name}}
      
parent controller name: {{$parent.name}}
     
  

myApp.controller("ParentCtrl", function($scope){
  $scope.vm = {
    name: "John"
  };
})

myApp.controller("ChildCtrl", function($scope){

})


  父控制器中的vm.name变量值 
  

     子控制器中的vm.name变量值 
     
     

      
child controller name: {{vm.name}}
      
parent controller name: {{$parent.vm.name}}
     
  

myApp.controller("ArrayCtrl", function($scope){
  $scope.myArray = ["John", "Andrew"];
  
  $scope.add = function(name){
    $scope.myArray.push(name);
  }
})

myApp.controller("CollectionCtrl", function($scope){

})


  My Array:{{myArray}}
  
  parent controller:
  
  Add New Item
  
  

    child controller:
    
    
    Add New Item
  

myApp.controller("CollectionCtrl", function($scope){
  //插入到某个位置
  $scope.add = function(name, index){
    $scope.myArray.splice(index,0, name);
  }
})


  My Array:{{myArray}}
  
  parent controller:
  
  Add New Item
  
  

    child controller:
    
    
    Add New Item
  

(function() {
  'use strict';

  angular
    .module('DemoApp')
    .controller('BaseCtrl', BaseCtrl);

  //手动注入一些服务
  BaseCtrl.$inject = ['$scope','CRUDServices'];

  /* @ngInject */
  function BaseCtrl($scope,CRUDServices) {
    var _this = this;
    //当前 controller 提供一些方法
    _this.bFormValid = formValid;

    activate();

    ////////////////

    //初始化时候调用
    function activate() {

      getList();
    }

    // 获取数据列表
    function getList() {
      //把当前的结果赋值给 bList 属性上
      _this.bList = CRUDServices.getList();
    }

    // 表单验证
    function formValid(){

      //do some thing
      return false;
    }
  }
})();

(function() {
  'use strict';

  angular
    .module('DemoApp')
    .service('ExtendServices', ExtendServices);

  ExtendServices.$inject = [];

  /* @ngInject */
  function ExtendServices() {

    return {
      getList: getList  //获取 list 列表
    }

    ////////////////

    function getList() {
      return [{ id: 1, name: '张三' }, { id: 2, name: '李四' }]
    }
  }
})();

(function() {
  'use strict';

  angular
    .module('DemoApp')
    .controller('ChildCtrl', ChildCtrl);

  //手动注入一些服务
  //ExtendServices 用来提供数据的 Servie
  ChildCtrl.$inject = ['$scope', '$controller','ExtendServices'];

  /* @ngInject */
  function ChildCtrl($scope, $controller,ExtendServices) {

    var vm = this;

    //调用我们父 controller 
    var parentCtrl = $controller('BaseCtrl', { $scope, $scope,CRUDServices:ExtendServices })

    //通过 angular.extend 把父控制器上的 方法和属性 绑定到 子的对象上
    angular.extend(vm, parentCtrl);


    activate();

    ////////////////

    function activate() {
      
      //调用表单验证方法
      vm.bFormValid();      
      
    }
  }
})();

  
  
{{item}}