I have a service called Example
that I used in my angular 1 application. It has angular 1 dependencies, $resource, $http, $q
and I would like to use it in my angular 2 service.
However below is how I'm attempting to implement the upgrade.
var ExampleService = require('./service.js');
angular.module('angular-legacy',[]).service('example', ExampleService);
upgradeAdapter.upgradeNg1Provider('example');
var AppComponent =
ng.core.Component({
selector: 'app',
providers: [ExampleService]
})
.View({
template: ' <div>Hello </div> ',
})
.Class({
constructor: [ExampleService, function (service) {
console.log(service);
}]
});
I get an error along these lines.
cannot resolve all parameters for 'ExampleService'(?, ?, ?, ?, ?).
Is there a way I can inject the upgraded version of ExampleService?
After some struggle I figured this out. I packaged everything up in a small example to make it easy for those who come across this in the future.
https://github.com/danielrasmuson/Angular2-Use-Angular1Service-ES5
Here is the meat of it.
var core = require('angular2/core');
var bootstrap = require('angular2/platform/browser').bootstrap;
var UpgradeAdapter = require('angular2/upgrade').UpgradeAdapter;
var ng = {
core: core
}
var AppComponent =
ng.core.Component({
selector: 'app'
})
.View({
template: '<h1>working</h1>'
})
.Class({
constructor: function(pinsService){
pinsService.working();
}
});
AppComponent.parameters = [new ng.core.Inject('PinsService')];
angular.module('interestApp', [])
.service('PinsService', function($http, $q) {
this.working = function(){
alert('servicce working');
}
});
var upgradeAdapter = new UpgradeAdapter();
angular.module('interestApp')
.directive('app', upgradeAdapter.downgradeNg2Component(AppComponent))
upgradeAdapter.upgradeNg1Provider('PinsService');
upgradeAdapter.bootstrap(document.body, ['interestApp']);
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.