В чем преимущество определения приложения Angular?

В некоторых обучающих программах AngularJS приложение angular определяется как:

myApp = angular.module("myApp",[]);

Но мы можем обойтись и без него. Единственное различие, которое я вижу, это когда мы определяем контроллер, мы не можем использовать идиому:

myApp.controller("myCtrl",function(){ })

но он должен использовать

function myCtrl (){}

Есть ли другие преимущества в определении myApp явно, учитывая, что я создам только одно приложение для своего сайта? Если я не определяю myApp, то где мои модули привязаны к?

Если есть, как я могу воссоздать myApp при тестировании с помощью Jasmin?

Ответы

Ответ 1

Вы можете определить контроллеры в (по крайней мере) тремя способами:

  • Определите контроллер как глобальный var (сохраненный в объекте window)

    function Ctrl() {}
    

    что и выполняется:

    window.Ctrl = function () {}
    
  • Создайте модуль и используйте возвращаемый экземпляр для создания новых контроллеров:

    var app = angular.module('app', []);
    app.controller('Ctrl', function() {});
    
  • Создайте контроллеры непосредственно на модуле, не сохраняя никаких ссылок (так же, как 2, но без использования vars):

    angular.module('app', []);
    angular.module('app').controller('Ctrl', function() {});
    

С точки зрения Angular, все они делают то же самое, вы можете даже смешивать их вместе, и они будут работать. Единственное различие заключается в том, что опция 1 использует глобальные вары, а в параметрах 2 и 3 контроллеры хранятся внутри частного объекта Angular.

Ответ 2

Я понимаю, откуда вы пришли, поскольку объяснение по загрузке вашего Angular происходит повсеместно. Играя с Angular только на месяц (я поделюсь тем, что знаю, так или иначе), я видел, как вы определили это выше. Я тоже был в том же сценарии, где мне нужно только определить myApp один раз и не иметь нескольких.

В качестве альтернативы вы можете сделать что-то вроде этого ниже. Вы заметите, что Angular app и controller не должны жить тем же самым namespace. Я думаю, что это больше для удобства чтения и организации, чем любого.

JS:

window.app = {};
/** Bootstrap on document load and define the document along with 
      optional modules as I have below.
*/
angular.element(document).ready(function () {
    app.ang = angular.bootstrap(document, ['ngResource', 'ngSanitize']);

    // OR simply, works similarly.
    // angular.bootstrap(document, []);

});

/** Define Angular Controller */
app.myController= function ($scope, $resource, $timeout) {

};

HTML:

<div role="main" ng-controller="app.myController"></div>

Ответ 3

вы должны определить приложение с angular.module в любом случае. myApp.controller и функция myCtrl одинаковы.