Jak napisać moduł niestandardowy dla AngularJS?

Question

Potrzebuję napisać niestandardowy moduł dla AngularJS, ale nie mogę znaleźć żadnej dobrej dokumentacji na ten temat. Jak napisać moduł niestandardowy dla AngularJS, który mogę udostępnić innym?

Answer 1

W tych sytuacjach, gdy uważasz, że dokumenty już ci nie pomogą, dobrym sposobem nauki jest spojrzenie na inne już zbudowane moduły i zobaczenie, jak inni to zrobili, jak zaprojektowali architekturę i jak zintegrowali je w swojej aplikacji.
Po obejrzeniu tego, co zrobili inni, powinniśmy mieć przynajmniej punkt wyjścia.

Na przykład spójrz na wszystkie angular ui module, a zobaczysz wiele niestandardowych modułów.
Niektóre definiują just a single directive, podczas gdy inne definiują more stuff.

Jak @nXqd powiedział, podstawowym sposobem, aby utworzyć moduł jest:

// 1. define the module and the other module dependencies (if any) 
angular.module('myModuleName', ['dependency1', 'dependency2']) 

// 2. set a constant 
    .constant('MODULE_VERSION', '0.0.3') 

// 3. maybe set some defaults 
    .value('defaults', { 
     foo: 'bar' 
    }) 

// 4. define a module component 
    .factory('factoryName', function() {/* stuff here */}) 

// 5. define another module component 
    .directive('directiveName', function() {/* stuff here */}) 
;// and so on 

Po zdefiniowaniu moduł, to bardzo łatwo dodać elementy do niego (bez konieczności przechowywać moduł w zmiennej):

// add a new component to your module 
angular.module('myModuleName').controller('controllerName', function() { 
    /* more stuff here */ 
}); 

a część integracja jest dość prosta: wystarczy dodać go jako zależność od modułu aplikacji (here's jak kanciasty ui to robi).

angular.module('myApp', ['myModuleName']); 

Answer 2

Jeśli chcesz znaleźć dobry przykład, powinieneś zajrzeć do obecnego modułu napisanego w angularJS. Naucz się czytać ich kod źródłowy. Przy okazji jest to struktura, której używam do pisania modułów w kątowym JS:

var firstModule = angular.module('firstModule', []) 
firstModule.directive(); 
firstModule.controller(); 

// in your app.js, include the module 

To jest podstawowy.

Answer 3

var newMod = angular.module('newMod', []); 

newMod.controller('newCon', ['$scope', function ($scope) { 
    alert("I am in newCon"); 
    $scope.gr = "Hello"; 
}]); 

Tutaj newMod jest modułem, który nie ma zależności [] i posiada kontroler, który ma alert informujący jesteś w kontrolerze i zmienną o wartości cześć.