Question

我有一个baseController和一个childController

每当我将模块添加到baseController时，应用程序都会失败并显示错误：

Argument 'childController' is not a function, got undefined

编辑：添加了一个plnkr http://plnkr.co/edit/mi9Ytv0HaqE47ENod4Gn

这样可行：

angular
    .module('app')
    .controller('BaseController', baseController);

angular
    .module('app', ['ui.grid', 'ui.grid.pagination'])
    .controller('ChildController', childController)         

childController.$inject = ['$controller'];

function childController($controller) {
    var self = this;

    var baseController = $controller('BaseController', {
        $scope: self
    });

但是下面的不工作:(注意在baseController模块部分添加'ui.bootstrap'。）

angular
    .module('app', ['ui.bootstrap'])
    .controller('BaseController', baseController);

angular
    .module('app', ['ui.grid', 'ui.grid.pagination'])
    .controller('ChildController', childController)         

childController.$inject = ['$controller'];

function childController($controller) {
    var self = this;

    var baseController = $controller('BaseController', {
        $scope: self
    });

Answer 1

您要定义app模块两次。我不够聪明地确定发生了什么，但它应该看起来像这样：

angular
    .module('app', ['ui.grid', 'ui.grid.pagination'])
    .controller('BaseController', baseController)
    .controller('ChildController', childController);

Answer 2

对于继承，您可以使用标准JavaScript继承模式。这是一个使用$ injector的演示。

function Parent($scope) {
  $scope.name = 'Human';
  $scope.clickParent = function() {
    $scope.name = 'Clicked from base controller';
  }    
}

function Child($scope, $injector) {
  $injector.invoke(Parent, this, {$scope: $scope});
  $scope.name = 'Human Child';
  $scope.clickChild = function(){
    $scope.clickParent();
  }       
}

Child.prototype = Object.create(Parent.prototype);

AngularJS基本控制器加载模块

2 个答案: