ES6 modules DI proposal

[vojtajina]

!This is not meant to be submitted as it is of now!

Annotations Eventually all the .$x properties might become annotations.

var MainController = function($scope) {...};
MainController.$inject = ['$scope'];
MainController.$providerType = 'controller';

// will become
@controllerProvider
@inject('$scope')
var MainController = function(scope) {...};

Provider types (factory/service/value/etc) There is an issue - annotating non-function values (eg. objects or strings) is tricky. The annotation would have to wrap the value object. I think the DI itself might provide just two types: class (currently "service") and factory. It would even not require any special annotation - if it is a function, it's a provider of type factory, if it's a class (ES6), it's a provider of type class. That would lead into just a single annotation @provider. The downside is that developers have to wrap all the current "values" into a function wrapper, to make it a factory. The benefit is simplification.

// This is "class" provider (currently "service"), 
// will get called with "new" operator.
@provider
class Http {
  @inject('$q')
  constructor(q) {}
}

// This are identical "factory" providers.
@provider
@inject('$q')
var createHttp = function(q) {};

@provider
@inject('$q')
function createHttp(q) {}

Angular specific providers On the top of the "type" and "factory", Angular can provide higher level APIs, such as "controller", "filter" or "directive".

@controllerProvider
class UserListController {}

@directiveProvider({
  selector: '[ng-if]',
  transclude: 'element'
})
class NgIfDirective {}