2013-10-18 37 views
0

我已经定义了2个控制器:

var myApp = angular.module('nestedControllersModule',[]); 
myApp.controller('ParentController', ['$scope', function($scope) { 
}]); 

myApp.controller('ChildController', ['$scope', '$injector', function($scope, $injector) { 

$injector.invoke(ParentController, this, {$scope: $scope}); 
}]); 

这让:不定义ParentController:引发ReferenceError。

function ParentController($scope) {} 

我试图注入家长在孩子的话,我能继承父定义的常用功能:

如果ParentController被定义为这样的代码才起作用。

var myApp = angular.module('nestedControllersModule',[]); 
myApp.controller('ParentController', ['$scope', function($scope) { 
    $scope.name = 'ParentName'; 
    $scope.Type = 'ParentType'; 
    $scope.clickme = function() { 
     alert('This is parent controller "ParentController" calling'); 
    } 
}]); 

myApp.controller('ChildController', ['$scope', '$injector', '$ParentController', function($scope, $injector, $ParentController) { 
    $injector.invoke(ParentController, this, {$scope: $scope}); 
    $scope.name = 'Child'; 
}]); 
+0

什么是你想做?将ParentController注入到ChildController中?你不必为此使用$注入器。 – chubbsondubs

回答

0
myApp.controller('ParentController', ['$scope', function($scope) { 
}]); 


myApp.controller('ChildController', ['$scope', 'ParentController', function($scope, ParentController) { 
    // ok now you have ParentController 
}]); 

但我认为你需要使用服务到控制器或使用PubSub的模型之间共享数据/功能:

What's the correct way to communicate between controllers in AngularJS?

这将减少你的应用程序的部分之间的耦合。

0

这是一个基本的解决办法,以实现你以后:

var myApp = angular.module('nestedControllersModule',[]); 
myApp.factory('ParentControllerFactory', function() { 
    function ParentControllerFactory($scope) { 
     $scope.name = 'ParentName'; 
     $scope.Type = 'ParentType'; 
     $scope.clickme = function() { 
      alert('This is parent controller "ParentController" calling'); 
     } 
    } 
    return (ParentControllerFactory); 
}) 
.controller('ParentController', ['$scope', '$injector', 'ParentControllerFactory', function ($scope, $injector, ParentControllerFactory) { 
    $injector.invoke(ParentControllerFactory, this, { 
     $scope: $scope 
    }); 
}]) 
.controller('ChildController', ['$scope', '$injector', 'ParentControllerFactory', function ($scope, $injector, ParentControllerFactory) { 
    $injector.invoke(ParentControllerFactory, this, { 
     $scope: $scope 
    }); 
}]); 

我说的解决方法,因为它可能是值得寻找到正确实施服务来管理所有的共性如前面提到的(或更好,但分裂共同点为指令,clickme例如是一个很好的候选人)

...还请注意,因为它是上面将很有可能查找一个hissy适合如果/当你缩小你的脚本后,所以要小心在哪里和如何它使用。

0

考虑使用$控制器服务可能使用Mixin模式。

在你的榜样,你会替换为$控制器服务的$注射器服务:

var myApp = angular.module('nestedControllersModule',[]); 
myApp.controller('ParentController', ['$scope', function($scope) { 
    $scope.name = 'ParentName'; 
    $scope.Type = 'ParentType'; 
    $scope.clickme = function() { 
     alert('This is parent controller "ParentController" calling'); 
    } 
}]); 

myApp.controller('ChildController', ['$scope', '$controller', '$ParentController', function($scope, $controller, $ParentController) { 
    $controller('ParentController',{$scope: $scope}) 
    $scope.name = 'Child'; 
}]); 

这是使用$控制器服务的一个很好的概述: http://vadimpopa.com/split-large-angularjs-controllers-using-the-mixin-pattern/