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

Popular posts from this blog

python - How to insert QWidgets in the middle of a Layout? -

python - serve multiple gunicorn django instances under nginx ubuntu -

module - Prestashop displayPaymentReturn hook url -