@@ -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
4374Default dialog options can be specified by providing an instance of ` MatDialogConfig ` for
4475MAT_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
144144By 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