Skip to content

Commit a2bc36f

Browse files
GoodDayForSurfGoodDayForSurf
committed
use ngModule syntax in demos with provideZoneChangeDetection
1 parent 8ae5e00 commit a2bc36f

File tree

10 files changed

+5565
-1429
lines changed

10 files changed

+5565
-1429
lines changed

‎apps/demos/Demos/Accordion/Overview/Angular/app/app.component.ts‎

Lines changed: 18 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2-
import { bootstrapApplication, BrowserModule } from '@angular/platform-browser';
1+
import { NgModule, Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
34

45
import {
56
DxAccordionModule, DxCheckBoxModule, DxSliderModule, DxTagBoxModule,
@@ -18,17 +19,12 @@ if (window && window.config?.packageConfigPaths) {
1819
}
1920

2021
@Component({
22+
standalone: false,
2123
selector: 'demo-app',
2224
templateUrl: `.${modulePrefix}/app.component.html`,
2325
styleUrls: [`.${modulePrefix}/app.component.css`],
2426
providers: [Service],
2527
preserveWhitespaces: true,
26-
imports: [
27-
DxAccordionModule,
28-
DxCheckBoxModule,
29-
DxSliderModule,
30-
DxTagBoxModule,
31-
],
3228
})
3329
export class AppComponent {
3430
companies: Company[];
@@ -38,8 +34,18 @@ export class AppComponent {
3834
}
3935
}
4036

41-
bootstrapApplication(AppComponent, {
42-
providers: [
43-
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
37+
@NgModule({
38+
imports: [
39+
BrowserModule,
40+
DxAccordionModule,
41+
DxCheckBoxModule,
42+
DxSliderModule,
43+
DxTagBoxModule,
4444
],
45-
});
45+
declarations: [AppComponent],
46+
bootstrap: [AppComponent],
47+
providers: [provideZoneChangeDetection({ eventCoalescing: true })]
48+
})
49+
export class AppModule { }
50+
51+
platformBrowserDynamic().bootstrapModule(AppModule);

‎apps/demos/Demos/DataGrid/DeferredSelection/Angular/app/app.component.ts‎

Lines changed: 22 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,15 @@
11
import {
2-
Component, ViewChild, AfterViewInit, enableProdMode, provideZoneChangeDetection,
2+
NgModule,
3+
Component,
4+
ViewChild,
5+
AfterViewInit,
6+
enableProdMode,
7+
provideZoneChangeDetection,
38
} from '@angular/core';
9+
import { BrowserModule } from '@angular/platform-browser';
10+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
411
import { DxDataGridModule, DxDataGridComponent, DxButtonModule } from 'devextreme-angular';
512
import { query, DataSourceOptions } from 'devextreme-angular/common/data';
6-
import { bootstrapApplication } from "@angular/platform-browser";
713

814
if (!/localhost/.test(document.location.host)) {
915
enableProdMode();
@@ -16,14 +22,11 @@ if (window && window.config?.packageConfigPaths) {
1622
}
1723

1824
@Component({
25+
standalone: false,
1926
selector: 'demo-app',
2027
templateUrl: `.${modulePrefix}/app.component.html`,
2128
styleUrls: [`.${modulePrefix}/app.component.css`],
2229
preserveWhitespaces: true,
23-
imports: [
24-
DxDataGridModule,
25-
DxButtonModule,
26-
],
2730
})
2831
export class AppComponent implements AfterViewInit {
2932
@ViewChild(DxDataGridComponent, { static: false }) dataGrid: DxDataGridComponent;
@@ -76,8 +79,18 @@ export class AppComponent implements AfterViewInit {
7679
}
7780
}
7881

79-
bootstrapApplication(AppComponent, {
82+
@NgModule({
83+
imports: [
84+
BrowserModule,
85+
DxDataGridModule,
86+
DxButtonModule,
87+
],
88+
declarations: [AppComponent],
89+
bootstrap: [AppComponent],
8090
providers: [
8191
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
82-
],
83-
});
92+
]
93+
})
94+
export class AppModule { }
95+
96+
platformBrowserDynamic().bootstrapModule(AppModule);

‎apps/demos/Demos/DataGrid/NewRecordPosition/Angular/app/app.component.ts‎

Lines changed: 18 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2-
import { bootstrapApplication, BrowserModule } from '@angular/platform-browser';
1+
import {NgModule, Component, enableProdMode, provideZoneChangeDetection} from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
34
import Guid from 'devextreme/core/guid';
45
import { CustomStore } from 'devextreme-angular/common/data';
56
import { DxSelectBoxModule } from 'devextreme-angular';
@@ -20,14 +21,10 @@ if (window && window.config?.packageConfigPaths) {
2021

2122
@Component({
2223
selector: 'demo-app',
24+
standalone: false,
2325
templateUrl: `.${modulePrefix}/app.component.html`,
2426
styleUrls: [`.${modulePrefix}/app.component.css`],
2527
providers: [Service],
26-
imports: [
27-
BrowserModule,
28-
DxDataGridModule,
29-
DxSelectBoxModule,
30-
],
3128
})
3229
export class AppComponent {
3330
dataSource: CustomStore;
@@ -67,8 +64,18 @@ export class AppComponent {
6764
}
6865
}
6966

70-
bootstrapApplication(AppComponent, {
71-
providers: [
72-
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
67+
@NgModule({
68+
imports: [
69+
BrowserModule,
70+
DxDataGridModule,
71+
DxSelectBoxModule,
7372
],
74-
});
73+
declarations: [AppComponent],
74+
bootstrap: [AppComponent],
75+
providers: [
76+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
77+
]
78+
})
79+
export class AppModule { }
80+
81+
platformBrowserDynamic().bootstrapModule(AppModule);

‎apps/demos/Demos/DataGrid/RowSelection/Angular/app/app.component.ts‎

Lines changed: 16 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2-
import { bootstrapApplication } from '@angular/platform-browser';
1+
import {NgModule, Component, enableProdMode, provideZoneChangeDetection} from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
34
import { DxDataGridModule } from 'devextreme-angular';
45
import { Service, Employee } from './app.service';
56

@@ -15,10 +16,10 @@ if (window && window.config?.packageConfigPaths) {
1516

1617
@Component({
1718
selector: 'demo-app',
19+
standalone: false,
1820
templateUrl: `.${modulePrefix}/app.component.html`,
1921
styleUrls: [`.${modulePrefix}/app.component.css`],
2022
providers: [Service],
21-
imports: [DxDataGridModule],
2223
})
2324
export class AppComponent {
2425
employees: Employee[];
@@ -28,8 +29,17 @@ export class AppComponent {
2829
}
2930
}
3031

31-
bootstrapApplication(AppComponent, {
32+
@NgModule({
33+
imports: [
34+
BrowserModule,
35+
DxDataGridModule,
36+
],
37+
declarations: [AppComponent],
38+
bootstrap: [AppComponent],
3239
providers: [
3340
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
34-
],
35-
});
41+
]
42+
})
43+
export class AppModule { }
44+
45+
platformBrowserDynamic().bootstrapModule(AppModule);

‎apps/demos/Demos/Tabs/Selection/Angular/app/app.component.ts‎

Lines changed: 18 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
1-
import { Component, enableProdMode, provideZoneChangeDetection} from '@angular/core';
2-
import { bootstrapApplication } from '@angular/platform-browser';
1+
import {NgModule, Component, enableProdMode, provideZoneChangeDetection} from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
3+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
34
import { DxTabsModule, DxSelectBoxModule, DxMultiViewModule } from 'devextreme-angular';
45
import { Tab, Service } from './app.service';
56

@@ -15,14 +16,10 @@ if (window && window.config?.packageConfigPaths) {
1516

1617
@Component({
1718
selector: 'demo-app',
19+
standalone: false,
1820
templateUrl: `.${modulePrefix}/app.component.html`,
1921
styleUrls: [`.${modulePrefix}/app.component.css`],
2022
providers: [Service],
21-
imports: [
22-
DxTabsModule,
23-
DxMultiViewModule,
24-
DxSelectBoxModule,
25-
],
2623
})
2724
export class AppComponent {
2825
employees: Tab[];
@@ -32,8 +29,19 @@ export class AppComponent {
3229
}
3330
}
3431

35-
bootstrapApplication(AppComponent, {
32+
@NgModule({
33+
imports: [
34+
BrowserModule,
35+
DxTabsModule,
36+
DxMultiViewModule,
37+
DxSelectBoxModule,
38+
],
39+
declarations: [AppComponent],
40+
bootstrap: [AppComponent],
3641
providers: [
3742
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
38-
],
39-
});
43+
]
44+
})
45+
export class AppModule { }
46+
47+
platformBrowserDynamic().bootstrapModule(AppModule);

‎apps/demos/Demos/TreeView/ItemSelectionAndCustomization/Angular/app/app.component.ts‎

Lines changed: 20 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,14 @@
11
import {
2-
Component, Pipe, PipeTransform, enableProdMode, ViewChild, provideZoneChangeDetection,
2+
NgModule, Component, Pipe, PipeTransform, enableProdMode, ViewChild, provideZoneChangeDetection,
33
} from '@angular/core';
4-
import {bootstrapApplication, BrowserModule} from '@angular/platform-browser';
4+
import { BrowserModule } from '@angular/platform-browser';
5+
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
56
import { DxListModule, DxCheckBoxModule } from 'devextreme-angular';
67
import { DxTreeViewModule, DxTreeViewComponent, DxTreeViewTypes } from 'devextreme-angular/ui/tree-view';
78
import { DxSelectBoxModule, DxSelectBoxTypes } from 'devextreme-angular/ui/select-box';
89
import { Service, Employee } from './app.service';
910

10-
@Pipe({ name: 'title', standalone: true })
11+
@Pipe({ name: 'title' })
1112
export class TitlePipe implements PipeTransform {
1213
transform(item: Record<string, unknown>): string {
1314
return item.text + (item.price ? ` ($${item.price})` : '');
@@ -26,18 +27,11 @@ if (window && window.config?.packageConfigPaths) {
2627

2728
@Component({
2829
selector: 'demo-app',
30+
standalone: false,
2931
templateUrl: `.${modulePrefix}/app.component.html`,
3032
styleUrls: [`.${modulePrefix}/app.component.css`],
3133
providers: [Service],
3234
preserveWhitespaces: true,
33-
imports: [
34-
BrowserModule,
35-
DxTreeViewModule,
36-
DxListModule,
37-
DxCheckBoxModule,
38-
DxSelectBoxModule,
39-
TitlePipe,
40-
],
4135
})
4236
export class AppComponent {
4337
@ViewChild(DxTreeViewComponent<Employee>, { static: false }) treeView: DxTreeViewComponent;
@@ -100,8 +94,20 @@ export class AppComponent {
10094
}
10195
}
10296

103-
bootstrapApplication(AppComponent, {
97+
@NgModule({
98+
imports: [
99+
BrowserModule,
100+
DxTreeViewModule,
101+
DxListModule,
102+
DxCheckBoxModule,
103+
DxSelectBoxModule,
104+
],
105+
declarations: [AppComponent, TitlePipe],
106+
bootstrap: [AppComponent],
104107
providers: [
105108
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
106-
],
107-
});
109+
]
110+
})
111+
export class AppModule { }
112+
113+
platformBrowserDynamic().bootstrapModule(AppModule);

‎apps/demos/Demos/TreeView/LoadDataOnDemand/Angular/app/app.component.ts‎

Lines changed: 16 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,8 @@
1-
import { Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2-
import { bootstrapApplication } from '@angular/platform-browser';
1+
import { NgModule, Component, enableProdMode, provideZoneChangeDetection } from '@angular/core';
2+
import { BrowserModule } from '@angular/platform-browser';
33
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
44
import { HttpClient, provideHttpClient, withFetch } from '@angular/common/http';
55
import { lastValueFrom } from 'rxjs';
6-
76
import { DxTreeViewComponent, DxTreeViewModule } from 'devextreme-angular';
87

98
if (!/localhost/.test(document.location.host)) {
@@ -17,10 +16,10 @@ if (window && window.config?.packageConfigPaths) {
1716
}
1817

1918
@Component({
19+
standalone: false,
2020
selector: 'demo-app',
2121
templateUrl: `.${modulePrefix}/app.component.html`,
2222
providers: [],
23-
imports: [DxTreeViewModule],
2423
})
2524
export class AppComponent {
2625
createChildren: DxTreeViewComponent['createChildren'];
@@ -30,15 +29,24 @@ export class AppComponent {
3029
const parentId = parent ? parent.itemData.id : '';
3130

3231
return lastValueFrom(
33-
http.get(`https://js.devexpress.com/Demos/NetCore/api/TreeViewData?parentId=${parentId}`),
32+
http.get(`https://js.devexpress.com/Demos/NetCore/api/TreeViewData?parentId=${parentId}`),
3433
);
3534
};
3635
}
3736
}
3837

39-
bootstrapApplication(AppComponent, {
38+
@NgModule({
39+
imports: [
40+
BrowserModule,
41+
DxTreeViewModule,
42+
],
4043
providers: [
41-
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
4244
provideHttpClient(withFetch()),
45+
provideZoneChangeDetection({ eventCoalescing: true, runCoalescing: true }),
4346
],
44-
});
47+
declarations: [AppComponent],
48+
bootstrap: [AppComponent],
49+
})
50+
export class AppModule { }
51+
52+
platformBrowserDynamic().bootstrapModule(AppModule);

0 commit comments

Comments
 (0)