Solution proposal: ES6 Class for ngModule.filter, ngModule.directive, ngModule.factory, ngModule.controller, ngModule.service, ngModule.provider
app/index.js
#!javascript
require('./utils/NgModuleParents'); // will expose the NgDirective, NgFilter etc to the window scope
testComp/index.js
#!javascript
//without new keyword and no super() call in the constructor required
ngModule.controller('TestController', require('./test.controller'));
ngModule.service('TestService', require('./test.service'));
ngModule.provider('TestProvider', require('./test.provider'));
//with new keyword and required super() call in the constructor
ngModule.directive('TestDirective', require('./test.directive'));
ngModule.filter('TestFilter', require('./test.filter'));
ngModule.factory('TestFactory', require('./test.factory'));
testComp/test.controller.js
#!javascript
'use strict';
// please use controllerAs syntax
class TestController extends window.NgController {
constructor($scope, TestFactory, TestProvider, TestService) {
this.controllerMethod();
}
controllerMethod() {
}
}
export default TestController;
testComp/test.service.js
#!javascript
'use strict';
class TestService extends window.NgController {
constructor() {
}
serviceMethod() {
}
}
export default TestService;
testComp/test.provider.js
#!javascript
'use strict';
class TestProvider extends window.NgProvider {
constructor() {
}
$get() {
var method = () => {
};
return {
method: method
};
}
}
export default TestProvider;
testComp/test.directive.js
#!javascript
'use strict';
class TestDirective extends window.NgDirective {
constructor() {
this.restrict = 'AE';
this.transclude = true;
this.template = '<ng-transclude />';
return super();
}
link(scope) {
scope.title = 'Title of this directive';
}
}
export default new TestDirective();
testComp/test.filter.js
#!javascript
'use strict';
class TestFilter extends window.NgFilter {
constructor() {
return super();
}
filter(input) {
return 'this is test filter'
}
}
export default new TestFilter();
testComp/test.factory.js
#!javascript
'use strict';
class TestFactory extends window.NgFactory {
constructor() {
this.date = new Date().toTimeString();
return super();
}
}
export default new TestFactory();
#NgModuleParents.js#
#!javascript
'use strict';
/*==================================================
* no need to call super() in the constructor
* exports default TestService
* exports default TestController
* exports default TestProvider
*==================================================/
/*
Extendable class for angular.provider written in ES6
*/
((window) => {
class NgProvider {
constructor() {
}
$get() {
return () => {
}
}
}
window.NgProvider = NgProvider;
})(window);
/*
Extendable class for angular.service written in ES6
*/
((window) => {
class NgService {
constructor() {
}
}
window.NgService = NgService;
})(window);
/*
Extendable class for angular.controller written in ES6
*/
((window) => {
class NgController {
constructor() {
}
}
window.NgController = NgController;
})(window);
/*==================================================
* call return super() in the constructor is required
* exports default new TestFactory()
* exports default new TestDirective()
* exports default new TestFilter()
*==================================================/
/*
Extendable class for angular.factory written in ES6
*/
((window) => {
class NgFactory {
constructor() {
return () => {
return this;
}
}
}
window.NgFactory = NgFactory;
})(window);
/*
Extendable class for angular.directive written in ES6
*/
((window) => {
class NgDirective {
constructor() {
return () => {
return this;
};
}
}
window.NgDirective = NgDirective;
})(window);
/*
Extendable class for angular.filter written in ES6
*/
((window) => {
class NgFilter {
constructor() {
return () => {
return this.filter;
};
}
filter(input) {
return input;
}
}
window.NgFilter = NgFilter;
})(window);