bug(Dialog): Explicit injector does not work
- Vorherrschende Sprache
- TypeScript
- Sterne
- 25k
- Forks
- 6.8k
- Ø Merge
- 1 T. 8 Std.
- Gemergte PRs (30 T.)
- 91
Beschreibung
### Is this a regression?
- [ ] Yes, this behavior used to work in the previous version
### The previous version in which this bug was not present was
_No response_
### Description
Hey, I recently updated to v14 just for the newly added feature of the Dialog - the explicit injector, but it does not seem to work. I might be doing something wrong or misunderstood the new feature (to provide an `Injector` without having to provide a `ViewContainerRef`).
### Reproduction
Steps to reproduce:
Check out https://stackblitz.com/edit/angular-ozdqwy?file=src%2Fapp%2Fdialog-overview-example.ts (hope this lives long enough)
**OR**
1. Open the dialog example https://stackblitz.com/run?file=src/app/dialog-overview-example.ts
2. Add some service `@Injectable()
export class SomeService {
test = 123;
}`
3. Create an injector `const myInjector = Injector.create({
providers: [{ provide: SomeService }]
});`
4. Pass the injector `injector: myInjector`` to ``this.dialog.open`
5. Require the service `public someService: SomeService` in `DialogOverviewExampleDialog`'s constructor
### Expected Behavior
`SomeService` gets provided to `DialogOverviewExampleDialog`
### Actual Behavior
```
ERROR NullInjectorError: R3InjectorError(AppModule)[SomeService -> SomeService -> SomeService]:
NullInjectorError: No provider for SomeService!
at NullInjector.get (vendor.js:66456:21)
at R3Injector.get (vendor.js:66652:27)
at R3Injector.get (vendor.js:66652:27)
at R3Injector.get (vendor.js:66652:27)
at NgModuleRef.get (vendor.js:81766:29)
at ChainedInjector.get (vendor.js:81534:32)
at lookupTokenUsingModuleInjector (vendor.js:59680:31)
at getOrCreateInjectable (vendor.js:59732:10)
at Module.ɵɵdirectiveInject (vendor.js:67961:10)
at NodeInjectorFactory.DialogOverviewExampleDialog_Factory [as factory] (main.js:153:195)
```
### Environment
Angular CLI: 14.0.5
Angular: 14.0.5
Angular Material: 14.0.4
Node: 16.13.0
Package Manager: npm 8.1.0
OS: win32 x64
### Additional info
I glanced into the source code and I think the injector from the config is taken into account only when creating/attaching the
container:
https://github.com/angular/components/blob/c28bbdeb51c31cbd1f5e06528ef4d21b1650e4a8/src/cdk/dialog/dialog.ts#L224
but not when creating/attaching the actual content component:
https://github.com/angular/components/blob/c28bbdeb51c31cbd1f5e06528ef4d21b1650e4a8/src/cdk/dialog/dialog.ts#L311
and it seems that from a DI point of view, the implementation does not tie the content's Injector with the container's Injector. Again, I might be wrong.
Thanks!
Beitragsleitfaden
Rechercherichtung
Beginne mit src/cdk/dialog/dialog.ts an den referenzierten Zeilen 224 und 311 und reproduziere anschließend das Problem mithilfe des verlinkten StackBlitz-Beispiels und seiner expliziten Injector-Konfiguration. Die Aufgabe ist erledigt, wenn der über den expliziten Injector bereitgestellte SomeService-Provider für DialogOverviewExampleDialog verfügbar ist, ohne dass ein NullInjectorError auftritt.
Vom Indexierungsmodell aus dem Issue-Text verfasst.
Bewertung
- Tech-Stack
- angular, typescript
- Bereich
- frontend
- Issue-Typ
- Bug
- Schwierigkeit
- 3/5
- Geschätzter Aufwand
- 1-2 Tage
- Aktivitätsstatus
- Veraltet
- Klarheit
- Größtenteils klar
- Anfängerfreundlichkeit
- 45/100