Skip to content

Commit 474f1e1

Browse files
rudolfolahandrewseguin
authored andcommitted
docs(dialog): move up entry components section (#16575)
(cherry picked from commit d579537)
1 parent 2cfcd36 commit 474f1e1

File tree

1 file changed

+31
-31
lines changed

1 file changed

+31
-31
lines changed

src/material/dialog/dialog.md

Lines changed: 31 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -39,6 +39,37 @@ export class YourDialog {
3939
}
4040
```
4141

42+
### Configuring dialog content via `entryComponents`
43+
44+
Because `MatDialog` instantiates components at run-time, the Angular compiler needs extra
45+
information to create the necessary `ComponentFactory` for your dialog content component.
46+
47+
For any component loaded into a dialog, you must include your component class in the list of
48+
`entryComponents` in your NgModule definition so that the Angular compiler knows to create
49+
the `ComponentFactory` for it.
50+
51+
```ts
52+
@NgModule({
53+
imports: [
54+
// ...
55+
MatDialogModule
56+
],
57+
58+
declarations: [
59+
AppComponent,
60+
ExampleDialogComponent
61+
],
62+
63+
entryComponents: [
64+
ExampleDialogComponent
65+
],
66+
67+
providers: [],
68+
bootstrap: [AppComponent]
69+
})
70+
export class AppModule {}
71+
```
72+
4273
### Specifying global configuration defaults
4374
Default dialog options can be specified by providing an instance of `MatDialogConfig` for
4475
MAT_DIALOG_DEFAULT_OPTIONS in your application's root module.
@@ -109,37 +140,6 @@ You can control which elements are tab stops with the `tabindex` attribute
109140

110141
<!-- example(dialog-content) -->
111142

112-
### Configuring dialog content via `entryComponents`
113-
114-
Because `MatDialog` instantiates components at run-time, the Angular compiler needs extra
115-
information to create the necessary `ComponentFactory` for your dialog content component.
116-
117-
For any component loaded into a dialog, you must include your component class in the list of
118-
`entryComponents` in your NgModule definition so that the Angular compiler knows to create
119-
the `ComponentFactory` for it.
120-
121-
```ts
122-
@NgModule({
123-
imports: [
124-
// ...
125-
MatDialogModule
126-
],
127-
128-
declarations: [
129-
AppComponent,
130-
ExampleDialogComponent
131-
],
132-
133-
entryComponents: [
134-
ExampleDialogComponent
135-
],
136-
137-
providers: [],
138-
bootstrap: [AppComponent]
139-
})
140-
export class AppModule {}
141-
```
142-
143143
### Accessibility
144144
By default, each dialog has `role="dialog"` on the root element. The role can be changed to
145145
`alertdialog` via the `MatDialogConfig` when opening.

0 commit comments

Comments
 (0)