'Dualboot Angular13 and Angular1: cannot downgrade injectable services with parameters
I have dual boot with Angular 13 and Angular 1. The app is built with webpack
v5. The tsconfig
has key "emitDecoratorMetadata":true
. After install I run NGCC on the NPM dependencies.
I cannot use downgraded v13 service with constructor parameters inside the v1 components. The v13 services without constructor parameters are downgraded successfully.
- MyService.ts:
@Injectable({providedIn: 'root'})
export class MyV13Service {
constructor(@Inject('DomSanitizer') private sanitizer: any) {
}
}
- app.module.ts:
import angular from 'angular';
angular.module('MyV1Module', [
...
])
.factory('MyV13Service', downgradeInjectable(MyV13Service))
@NgModule({
imports: [BrowserModule,UpgradeModule],
providers: [
MyV13Service,
{provide: 'DomSanitizer', useFactory: (i: any) => i.get('DomSanitizer'), deps: ['$injector']}
]
...
})
export class AppModule {...}
I tried also:
import {DomSanitizer} from '@angular/platform-browser';
@Injectable({providedIn: 'root'})
export class MyV13Service {
constructor(private sanitizer: DomSanitizer) {
}
}
and:
import {DomSanitizer} from '@angular/platform-browser';
@NgModule({
imports: [BrowserModule,UpgradeModule],
providers: [
MyV13Service,
{provide: DomSanitizer, useFactory: (i: any) => i.get('DomSanitizer'), deps: ['$injector']}
]
...
})
export class AppModule {...}
I tried also to import another dependency, like Restangular
.
Everything without success. In all cases I receive an error:
Error: Error while instantiating injectable 'MyV13Service': This constructor is not compatible with Angular Dependency Injection because its dependency at index 0 of the parameter list is invalid. This can happen if the dependency type is a primitive like a string or if an ancestor of this class is missing an Angular decorator. Please check that 1) the type for the parameter at index 0 is correct and 2) the correct Angular decorators are defined for this class and its ancestors.
WIDW?
[UPDATE]: when I provide my service this way (with HttpClient dependency):providers:[{provide: MyV13Service, useFactory: (i: any) => i.get('MyV13Service'), deps: ['HttpClient']}]
The error changes to:
Error: Error while instantiating injectable 'MyV13Service': R3InjectorError(AppModule)[MyV13Service -> HttpClient -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
at Object.factory (static.mjs:899:1)
When I add the HttpClient
to the list of providers the error remains the same. Both HttpClient
and DomSanitizer
are not injectable.
[UPDATE]: the code is working when it is built with angular-cli. So, the problem here is in the webpack configuration.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|