Skip to content

Commit 292455b

Browse files
authored
docs: improve angular tutorial (#1587)
1 parent 76943bc commit 292455b

File tree

1 file changed

+33
-0
lines changed

1 file changed

+33
-0
lines changed

docs/Angular-tutorial.md

Lines changed: 33 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -96,6 +96,39 @@ export class AppModule {}
9696
<ui5-input [(ngModel)]="value" origami></ui5-input>
9797
```
9898

99+
4. Make Angular boot after UI5 Web Components are defined:
100+
101+
In the module, where you are using UI5 Web Components, you should add the ```APP_INITIALIZER``` provider. In order to do so, import ```APP_INITIALIZER``` and add it to the providers array like this (In this example we will add it in the ```app.module.ts```):
102+
```js
103+
import { ..., APP_INITIALIZER } from '@angular/core';
104+
105+
import CheckBox from "@ui5/webcomponents/dist/CheckBox";
106+
107+
function onAppInit(): () => Promise<any> {
108+
return (): Promise<any> => {
109+
return CheckBox.define();
110+
};
111+
}
112+
113+
@NgModule({
114+
declarations: [
115+
...
116+
],
117+
imports: [
118+
...
119+
],
120+
providers: [
121+
{
122+
provide: APP_INITIALIZER,
123+
useFactory: onAppInit,
124+
multi: true
125+
},
126+
],
127+
schemas: [ CUSTOM_ELEMENTS_SCHEMA ],
128+
bootstrap: [AppComponent]
129+
})
130+
```
131+
99132
### Internet Explorer 11 Support
100133

101134
If you need your application to run on Internet Explorer 11, there are some additional steps you should to:

0 commit comments

Comments
 (0)