javascript - Angular2 + Angular1 + ES5 syntax component subscription -


first of let me still using es5, because writing frontend of google apps scripts application , didn't have time/patience make typescript work.

i using method in order upgrade angular1 app angular2:

http://www.codelord.net/2016/01/07/adding-the-first-angular-2-service-to-your-angular-1-app/

i have overlayloaderservice service show loading spinner in overlay div simple functions , set loading state, , overlayloader component show div itself.

service:

var overlayloaderservice = ng.core.   injectable().   class({     constructor: function() {       this.loading = false;       this.statechange = new ng.core.eventemitter();     },     setstate: function(state) {       this.loading.value = state;       this.statechange.emit(state);     },     getstate: function() {       console.log(this.loading);     }   });  upgradeadapter.addprovider(overlayloaderservice); angular.module('gojira').factory('overlayloaderservice', upgradeadapter.downgradeng2provider(overlayloaderservice)); 

component:

var overlayloadercomponent = ng.core   .component({     selector: 'overlay-loader',     template: '<div [hidden]="loading" id="overlay-loader"></div>',     providers: [overlayloaderservice]   }).class({     constructor: [overlayloaderservice, function(overlayloaderservice) {       this.loading = !overlayloaderservice.loading.value;       this._subscription = overlayloaderservice.statechange.subscribe(function (value) {         console.log(value);         this.loading = !value;       });     }],   });  angular.module('gojira').directive('overlayloader', upgradeadapter.downgradeng2component(overlayloadercomponent)); 

what trying achieve component update loading property when call setstate() method in overlayloaderservice.

the subscription never called, guess doing terribly wrong here.

any appreciated.

remove

providers: [overlayloaderservice] 

from overlayloadercomponent should work, provider has been added adapter. otherwise, seems angular 1 component , angular 2 component using different instance of service.


Comments

Popular posts from this blog

javascript - jQuery: Add class depending on URL in the best way -

caching - How to check if a url path exists in the service worker cache -

Redirect to a HTTPS version using .htaccess -