javascript - AngularJs Provider in ES6 -
i trying create provider in angularjs es6 seems not getting injected ($get not getting called). below code:
export default class ngintltelinputprovider { constructor() { this.props = {}; this.setfn = (obj) => { if (typeof obj === 'object') { (var key in obj) { this.props[key] = obj[key]; } } }; this.set = this.setfn; } $get() { return object.create(this, { init: { value: (elm) => { if (!window.intltelinpututils) { console.log('intltelinpututils not defined. formatting , validation not work.'); } elm.intltelinput(props); } }, }); } } here app.js
angular.module('sample-app', [ngroute]) .config(routing) .provider('ngintltelinputpr', ngintltelinputprovider) .directive('ngintltelinput', () => new ngintltelinput()); so trying inject provider in directive when coming undefined. below directive
export default class ngintltelinput { constructor(ngintltelinputpr, $log, $window, $parse) { this.restrict = 'a'; this.require = 'ngmodel' this.ngintltelinputpr = ngintltelinputpr; console.log('provider:', ngintltelinputpr) } } ngintltelinput.$inject = ['ngintltelinput', '$log', '$window', '$parse'];
there problem how register directive:
.directive('ngintltelinput', () => new ngintltelinput()); which same as:
app.directive('ngintltelinput', function () { return new ngintltelinput(); }); as see, there no dependencies specified parameters first function.
this example work:
app.directive('ngintltelinput', function(ngintltelinputpr) { console.log(ngintltelinputpr); return new ngintltelinput(); }); also note need inject ngintltelinputpr instead of ngintltelinput in following line:
ngintltelinput.$inject = ['ngintltelinput', '$log', '$window', '$parse'] sadly, getting directives work es6 classes can pretty tricky, module.directive method expects factory function rather constructor.
you can read more here: using es6 classes angular 1.x directives
Comments
Post a Comment