Использование дочернего контроллера из другого модуля

Я определил модуль и сделал его основным модулем для своего приложения, используя директиву ng-app. Я добавил два контроллера в основное приложение с помощью функции angular.module ('myApp'). Controller(). Один из этих контроллеров имеет широкоэкранную область, тогда как другой контроллер является дочерним контроллером.Использование дочернего контроллера из другого модуля

Что я сейчас пытаюсь сделать, это включить контроллер, который принадлежит другому модулю (не основному модулю myApp), но я не могу понять это. Я не хочу глобальные контроллеры пространства имен.

Кто-нибудь знает, как это сделать?

Вот то, что я до сих пор:

<!doctype html> 
<html lang="en" data-ng-app='myApp' data-ng-controller='myApp.mainController'> 
<head> 
    <meta charset="utf-8"> 
    <title>Untitled</title> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <script> 
    $(function() { 
     var app, module; 

     //create two modules, one of which will be used for the app base 
     app = angular.module('myApp', []); 
     module = angular.module('otherModule', []); 

     //create main controller for main app 
     app.controller('myApp.mainController', function($scope) { 
     $scope.content = 'App main controller content'; 
     }); 

     //create child controller for main app 
     app.controller('myApp.subController', function($scope) { 
     $scope.content = 'App sub controller content'; 
     }); 

     //create a controller for the other module 
     module.controller('othermodule.controller', function($scope) { 
     $scope.content = 'Other module controller content'; 
     }); 
    }); 


    </script> 
</head> 
<body> 

    <!-- output content from main controller from main module: myApp --> 
    {{content}} 

    <!-- specify use of main module's child controller and output its content --> 
    <div data-ng-controller='myApp.subController'> 
    {{content}} 
    </div> 

    <!-- NOT WORKING - ideally should output content from the other module's controller --> 
    <div data-ng-controller='othermodule.controller'> 
    {{content}} 
    </div> 

    <!-- load angular library --> 
    <script src="lib/angular/angular.js"></script> 
</body> 
</html>

Этот код выводит следующее с ошибкой JavaScript, по существу говоря, что othermodule.controller контроллер не был найден.

App main controller content

App sub controller content

{{content}}

Exact Ошибка:

> Error: Argument 'othermodule.controller' is not a function, got 
> undefined 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:1005 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:1016 
> @http://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:4740 
> applyDirectivesToNode/nodeLinkFn/<@http://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:4322 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:140 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:4307 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:3953 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:3956 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:4338 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:3953 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:3858 
> bootstrap/</<@http://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:964 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:7993 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:8073 
> bootstrap/<@http://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:962 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:2843 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:961 
> [email protected]://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:936 
> @http://localhost/sandbox/angular/apptemplate/lib/angular/angular.js:14729 
> b.Callbacks/[email protected]://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js:3 
> b.Callbacks/[email protected]://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js:3 
> [email protected]://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js:3 
> [email protected]://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js:3 
> 
> http://localhost/sandbox/angular/apptemplate/lib/angular/angular.js 
> Line 5687

источник

2013-04-19 James

То, что вы сделали в настоящее время "объявлен" два модуля app и module.

Когда угловые бутстрапы, вы попросили его загрузить с app. Итак, теперь ваше приложение загружается с app, но app не имеет ссылки на ваш другой модуль (это module!).

Таким образом, вам придется либо самонастройки приложения с app и указать зависимость от module или самонастройок приложения с абсолютно новым модулем и указать зависимость от app и module.

Это как определить зависимость

angular.module('app',['module']);

Если вы хотите создать совершенно новый модуль и указать как в качестве зависимостей

angular.module('myApp',['app','module'])

Примечание: если создать совершенно новый модуль , вам придется загрузите свое угловое приложение с помощью этого нового модуля.

<html ng-app="myApp"...

источник

2013-04-19 21:49:10 ganaraj

Это делает 100% смысл. Спасибо. – James

Использование дочернего контроллера из другого модуля

ответ

Смежные вопросы