angular / angular/components

docs-bug(MatDialog): Document standalone import

Offen
#26,124 5 Kommentare 5 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen
area: docs area: material/dialog P4
Vorherrschende Sprache
TypeScript
Sterne
25k
Forks
6.8k
Ø Merge
1 T. 8 Std.
Gemergte PRs (30 T.)
91

Beschreibung

### Documentation Feedback

TLDR; would be nice to document how to provide dialog and snackbar for standalone components.
I don't want to provide MatDialogModule for every standalone component that uses a dialog.

I guess I could add it to main.ts. I have a convenience service that does alert(), confirm(), error() dialogs and hides the MatDialogModule from simple components. I don't have a great way of providing MatDialogModule for this convenience service.

in the [docs](https://material.angular.io/components/dialog/api) it says:

`import {MatDialogModule} from '@angular/material/dialog';`

now that i'm using standalone components,
is it recommend to use:
`importProvidersFrom(MatDialogModule),`
in main.ts

e.g.

```

bootstrapApplication(AppComponent, {
providers: [
// https://this-is-angular.github.io/angular-guides/docs/standalone-apis/configuring-the-router-using-standalone-features
provideRouter(
routes,
withDebugTracing()),
importProvidersFrom(HttpClientModule),
importProvidersFrom(MatDialogModule),
provideAnimations(),
]
}).catch(err => console.error(err));

```

I guess it wouldn't make sense to provide MatDialogModule to the convenience service separately to how I provide it to some standalone components, as then perhaps the app would have inconsistent dialogs, so in main.ts makes sense, just feels disorganised.

### Affected documentation page

https://material.angular.io/components/dialog/api

p.s

also worth mentioning, fyi, sometimes we have to explicitly import our components to avoid errors, but we don't have any entrypoints or anything:

```

async serviceMethodThatOpensDialog(
) {
const { SparkplugbDatapointBulkCreateComponent } = await import('../datapoint-sparkplugb/sparkplugb-datapoint-bulk-create/sparkplugb-datapoint-bulk-create.component'
)
return this.dialog.open(SparkplugbDatapointBulkCreateComponent, {
data: {
}
})
}

```

Beitragsleitfaden

Beitragsleitfaden öffnen

Rechercherichtung

Beginne mit der betroffenen Dokumentationsseite der Dialog API unter https://material.angular.io/components/dialog/api und prüfe, wie sie MatDialogModule derzeit dokumentiert. Das Issue bittet um eine Anleitung dazu, wie Dialog- und Snackbar-Services für Standalone-Komponenten bereitgestellt werden; erledigt ist die Aufgabe, wenn die Dokumentation den empfohlenen Ansatz für Standalone-Apps erläutert.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
angular, typescript
Bereich
documentation
Issue-Typ
Dokumentation
Schwierigkeit
2/5
Geschätzter Aufwand
1-3 Stunden
Aktivitätsstatus
Veraltet
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
35/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.