stackdave stackdave - 6 months ago 91
AngularJS Question

angular 1.5 method .name in export angular.module

I've been looking tutorial and documents; but i dont understand the code below. there is 2 pieces of code from 2 files; the service; and the file where import the service.

this is a piece code of a service angular file (address-local.js) :

export default angular.module('', [])
.factory('addressLocal', addressLocal)

/* @ngInject */
function addressLocal($http) {

and this is a piece of code of file where is injected the service (account.js):

import addressLocalService from '../services/address-local';

my question is:

  • what does .name method in export; most of examples i've seen on the web dont use .name method

  • what is the sense use '' in export; when in the import is not used, just an 'import addressLocalService'; what is the full documentation syntax ?

  • /* @ngInject */, is usefull?

where i can find complete documentation about .name or all the methos i can use in the "export" ? it's ES6 mixed with Angular?


Let's examine the lines one by one:

angular.module('', [])

This defines a new angular module named ''. The name coulld be anything. A module is just a repository of components (services, controllers, etc.). The returned value is the created angular module.

.factory('addressLocal', addressLocal)

This adds a service named 'addressLocal' to the angular module. The service is defined thanks to a factory function, addressLocal, defined right after. This returns the angular module.


This allows accessing the name of the module. This value (i.e. '') is what is exported by the ES6 module defined in this file.

/* @ngInject */
function addressLocal($http) {

This is the factory function which creates and returns the addressLocal service. It uses the injected $http service. @ngInject is used by a tool used at build time, named ng-annotate, which allows transforming the above code to

['$http', function($http)]

This strange notation is necessary if you minify your code, because the minifier will change $http to something meaningless and shorter like a, and angular uses argument names to know what to inject.

import addressLocalService from '../services/address-local';

This allows importing what is exporting from the fine address-local.js, i.e. the module name. I don't know what the code after this line does with it. But the variable name is badly named, since addressLocalService is not the addressLocalService, but the name of the module defined in the first file.