AngularJS: включение модуля в отдельные контроллеры

0

Предполагая, что у нас есть два контроллера AngularJS в отдельных файлах, которые включены в файл HTML, например:

//////controller1.js
"use strict";
var someApp = angular.module('MYAPP');
//var someApp = angular.module('MYAPP',['ngCookies']); <-- Does not work

someApp.controller('Controller1', function($scope) {

    $scope.CookieFunction = function(){
        //foo
    };
});   


//////controller2.js
"use strict";
var someApp = angular.module('MYAPP',['ngCookies','ui.bootstrap']);

someApp.controller('Controller2', function($scope,$cookies) {

    $scope.SomeOtherfunction = function(){
        //foo
    };
}); 

//HTML file
<script src="////controller1.js"></script>
<script src="////controller2.js"></script>

Внутренний контроллер1, я хотел бы выполнить некоторую операцию Cookie, поэтому вам нужно включить ngCookies. Если я делаю это внутри ////controller1.js, тогда контроллер2 не будет определен. Я предпочитаю включать модули именно там, где они мне нужны, а не где-то еще. Как я могу достичь этого без "удаления" последующих контроллеров?

EDIT: Если я переведу ngCookies от контроллера2 к контроллеру1, я получаю это сообщение об ошибке (Argument 'controller2' не является функцией, получившей неопределенное значение)

  • 0
    Вы не можете «стереть последующие контроллеры», если у них нет одинаковых имен .... что вы имеете в виду? Что значит «Если я сделаю это внутри ////controller1.js, то controller2 станет неопределенным». значит? Вам придется уточнить, потому что ваш вопрос очень расплывчатый, как есть.
  • 0
    Я обновил код выше. Это означает, что если я переместу включение ngCookies из controller2 в controller1 (где я на самом деле его использую), то controller2 станет неопределенным !?
Теги:

4 ответа

0
Лучший ответ

Вы можете сделать это, создав различные модули, как показано ниже. Также это предпочтительный способ, когда мы хотим модулизировать наше приложение.

 //////app.js
"use strict";
var mainApp = angular.module('MYAPP', ['SomeApp', 'OtherApp']);


 //////controller1.js
var someApp = angular.module('SomeApp',['ngCookies']);
someApp.controller('Controller1', function($scope,$cookies) {

    $scope.CookieFunction = function(){
        //foo
    };
});   


//////controller2.js
"use strict";
var otherApp = angular.module('OtherApp ',[]);

otherApp.controller('Controller2', function($scope) {

    $scope.SomeOtherfunction = function(){
        //foo
    };
}); 

//HTML file
<script src="////app.js"></script>
<script src="////controller1.js"></script>
<script src="////controller2.js"></script>
Поделиться
0

Может, что-то в этом роде?

//////app.js
"use strict";
angular.module('MYAPP', ['myCtrl1', 'myCtrl2']);

//////controller1.js
angular.module('myCtrl1', ['ngCookies'])
  .controller('Controller1', function($scope) {

    $scope.CookieFunction = function(){
        //foo
    };
});   


//////controller2.js
"use strict";

angular.module('myCtrl2',['ngCookies','ui.bootstrap']);
  .controller('Controller2', function($scope,$cookies) {

    $scope.SomeOtherfunction = function(){
        //foo
    };
});

//HTML file
<script src="////app.js"></script>
<script src="////controller1.js"></script>
<script src="////controller2.js"></script>'
Поделиться
0

Когда вы даете второй аргумент угловому модулю, например angular.module('MYAPP',['ngCookies']), вы определяете новый модуль и связанные с ним зависимости. Если вы не включаете второй аргумент (зависимости), то функция действует как "getter" и просто возвращает ссылку на этот модуль, с помощью которого вы можете зарегистрировать больше контроллеров/служб/и т.д. Если вы указали angular.module('MYAPP', ['ngCookies']) несколько раз, вы перезаписываете свой предыдущий модуль MYAPP, поэтому Controller1, похоже, "стирается",

Поскольку вы включили ngCookies через 'angular.module(' MYAPP ', [' ngCookies ']) уже в файл, в котором находится Controller2, вам не нужно делать это снова в файле, в котором находится Controller1. используйте $ cookies только отлично Controller1 - просто убедитесь, что вы его ввели. т.е.

someApp.controller('Controller1', function($scope, $cookies) {

    $scope.CookieFunction = function(){
        //foo
    };
});
Поделиться
  • 0
    Да, я знаю об этом. Я не хотел включать ngCookies в оба файла, просто IN ////controller1.js. Но почему я не могу этого сделать, когда ////controller2.js не получает неопределенность?
  • 0
    Потому что angular.module ('moduleName') по сути является 'getter', в то время как angular.module ('moduleName' ['dependency1', 'dependency2', 'etc']) является "сеттером". Когда вы «устанавливаете» его более одного раза, вы в основном перезаписываете первый экземпляр. Когда вы указываете второй аргумент, он в основном объявляет новый модуль и его зависимости. Вам нужно сделать это только один раз. Вы можете использовать синтаксис получателя (только 1 аргумент) столько, сколько хотите, чтобы зарегистрировать больше контроллеров / директив / служб / и т. Д. В модуле, сколько хотите.
Показать ещё 2 комментария
0

Проблема в примере кода следующая (смените [ngCookies] на ['ngCookies'])

//////controller1.js
"use strict";
var someApp = angular.module('MYAPP',['ngCookies']);

Другой подход, упрощающий до 1 ////app.js

// ////app.js
"use strict";
var someApp = angular.module('MYAPP',['ngCookies']); 

someApp.controller('Controller1', function($scope) {

    $scope.CookieFunction = function(){
        //foo
    };
});   

someApp.controller('Controller2', function($scope,$cookies) {

    $scope.SomeOtherfunction = function(){
        //foo
    };
}); 

//HTML file
<script src="////app.js"></script>

Упростите до 1 главного ////app.js с различными файлами контроллера

Если вы хотите сохранить контроллеры в отдельном файле,

////app.js

var app = angular.module("testApp",['ngCookies','ui.bootstrap']);

test1.js

app.controller("controller1",function(){
// some code
})

test2.js

app.controller("controller2",function(){
// some code
})

Наконец, включите js файлы в html

<script src="////app.js"></script>
<script src="////controller1.js"></script>
<script src="////controller2.js"></script>
Поделиться
  • 0
    Опечатка, обновил пример. Все еще не работает ;)
  • 0
    Обновленный ответ, почему бы не упростить до 1 файла ////app.js?
Показать ещё 5 комментариев

Ещё вопросы

Сообщество Overcoder
Наверх
Меню