Skip to content

Commit 8c5c2f9

Browse files
ghiscodingghiscoding
committed
chore: migrate to Control Flow syntax
1 parent 964fb93 commit 8c5c2f9

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

47 files changed

+1143
-1061
lines changed

‎bootstrap5-demo-with-locales/src/app/examples/grid-remote.component.html‎

Lines changed: 14 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ <h2>
33
{{title}}
44
<span class="float-end">
55
<a style="font-size: 18px"
6-
target="_blank"
7-
href="https://github.com/ghiscoding/Angular-Slickgrid/blob/master/src/app/examples/grid-remote.component.ts">
6+
target="_blank"
7+
href="https://github.com/ghiscoding/Angular-Slickgrid/blob/master/src/app/examples/grid-remote.component.ts">
88
<span class="mdi mdi-link-variant"></span> code
99
</a>
1010
</span>
@@ -19,19 +19,21 @@ <h2>
1919
<div class="alert alert-danger col-md-7" role="alert">
2020
<strong>Note:</strong>
2121
this demo no longer displays any results because the WebAPI Key to connect and query the <b>Octopart Component
22-
Search</b> is no longer valid. However the concept remains valid, which is to use your own Custom DataView
23-
instead of the default SlickGrid DataView used by this library.
24-
</div>
22+
Search</b> is no longer valid. However the concept remains valid, which is to use your own Custom DataView
23+
instead of the default SlickGrid DataView used by this library.
24+
</div>
2525

26-
<div class="alert alert-warning col-md-6" role="alert" *ngIf="loading">
26+
@if (loading) {
27+
<div class="alert alert-warning col-md-6" role="alert">
2728
<i class="mdi mdi-sync mdi-spin-1s"></i>
2829
<span>Loading...</span>
2930
</div>
31+
}
3032

31-
<angular-slickgrid gridId="grid18" [columns]="columnDefinitions" [options]="gridOptions"
32-
[dataset]="dataset" [customDataView]="customDataView"
33-
(onAngularGridCreated)="angularGridReady($event.detail)"
34-
(onViewportChanged)="onViewportChanged()"
35-
(onSort)="onSort($event.detail.eventData, $event.detail.args)">
36-
</angular-slickgrid>
33+
<angular-slickgrid gridId="grid18" [columns]="columnDefinitions" [options]="gridOptions"
34+
[dataset]="dataset" [customDataView]="customDataView"
35+
(onAngularGridCreated)="angularGridReady($event.detail)"
36+
(onViewportChanged)="onViewportChanged()"
37+
(onSort)="onSort($event.detail.eventData, $event.detail.args)">
38+
</angular-slickgrid>
3739
</div>

‎bootstrap5-demo-with-translate/src/app/examples/example03.component.html‎

Lines changed: 12 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,16 @@ <h2>
66
style="font-size: 18px"
77
target="_blank"
88
href="https://github.com/ghiscoding/slickgrid-universal/blob/master/frameworks/angular-slickgrid/src/demos/examples/grid-editor.component.ts"
9-
>
9+
>
1010
<span class="mdi mdi-link-variant"></span> code
1111
</a>
1212
</span>
1313
</h2>
1414
<div class="subtitle">
1515
Grid with Inline Editors and onCellClick actions (<a
16-
href="https://ghiscoding.gitbook.io/angular-slickgrid/column-functionalities/editors"
17-
target="_blank"
18-
>Wiki docs</a
16+
href="https://ghiscoding.gitbook.io/angular-slickgrid/column-functionalities/editors"
17+
target="_blank"
18+
>Wiki docs</a
1919
>).
2020
<ul>
2121
<li>
@@ -65,7 +65,7 @@ <h2>
6565
data-test="auto-commit"
6666
[checked]="gridOptions.autoCommitEdit"
6767
(click)="changeAutoCommit()"
68-
/>
68+
/>
6969
Auto Commit Edit
7070
</label>
7171
</span>
@@ -97,8 +97,12 @@ <h2>
9797
</div>
9898

9999
<div class="col-sm-6">
100-
<div class="alert alert-info" *ngIf="updatedObject"><strong>Updated Item:</strong> {{ updatedObject | json }}</div>
101-
<div class="alert alert-warning" *ngIf="alertWarning"><strong>Updated Item:</strong> {{ alertWarning }}</div>
100+
@if (updatedObject) {
101+
<div class="alert alert-info"><strong>Updated Item:</strong> {{ updatedObject | json }}</div>
102+
}
103+
@if (alertWarning) {
104+
<div class="alert alert-warning"><strong>Updated Item:</strong> {{ alertWarning }}</div>
105+
}
102106
</div>
103107
</div>
104108

@@ -112,7 +116,7 @@ <h2>
112116
(onCellChange)="onCellChanged($event.detail.eventData, $event.detail.args)"
113117
(onClick)="onCellClicked($event.detail.eventData, $event.detail.args)"
114118
(onValidationError)="onValidationError($event.detail.eventData, $event.detail.args)"
115-
>
119+
>
116120
</angular-slickgrid>
117121
</div>
118122
</div>

‎bootstrap5-demo-with-translate/src/app/examples/example04.component.html‎

Lines changed: 46 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -6,16 +6,16 @@ <h2>
66
style="font-size: 18px"
77
target="_blank"
88
href="https://github.com/ghiscoding/slickgrid-universal/blob/master/frameworks/angular-slickgrid/src/demos/examples/grid-clientside.component.ts"
9-
>
9+
>
1010
<span class="mdi mdi-link-variant"></span> code
1111
</a>
1212
</span>
1313
</h2>
1414
<div class="subtitle">
1515
Sort/Filter on client side only using SlickGrid DataView (<a
16-
href="https://ghiscoding.gitbook.io/angular-slickgrid/column-functionalities/sorting"
17-
target="_blank"
18-
>Wiki docs</a
16+
href="https://ghiscoding.gitbook.io/angular-slickgrid/column-functionalities/sorting"
17+
target="_blank"
18+
>Wiki docs</a
1919
>)
2020
<br />
2121
<ul class="small">
@@ -41,47 +41,49 @@ <h2>
4141
Custom Filter are now possible, "Description" column below, is a customized InputFilter with different placeholder. See
4242
<a href="https://ghiscoding.gitbook.io/angular-slickgrid/column-functionalities/custom-filter" target="_blank"
4343
>Wiki - Custom Filter</a
44-
>
45-
</li>
46-
<li>MultipleSelect & SingeSelect Filters can use a regular "collection" or "collectionAsync" to load it asynchronously</li>
47-
</ul>
48-
</div>
44+
>
45+
</li>
46+
<li>MultipleSelect & SingeSelect Filters can use a regular "collection" or "collectionAsync" to load it asynchronously</li>
47+
</ul>
48+
</div>
4949

50-
<br />
51-
<span *ngIf="metrics" style="margin-right: 10px">
52-
<b>Metrics:</b> {{ metrics.startTime | date: "yyyy-MM-dd hh:mm aaaaa'm'" }} | {{ metrics.itemCount }} of
53-
{{ metrics.totalItemCount }} items
54-
</span>
55-
<div class="btn-group" role="group">
56-
<button class="btn btn-sm btn-outline-secondary btn-icon" data-test="scroll-top-btn" (click)="scrollGridTop()">
57-
<i class="mdi mdi-arrow-down mdi-rotate-180"></i>
50+
<br />
51+
@if (metrics) {
52+
<span style="margin-right: 10px">
53+
<b>Metrics:</b> {{ metrics.startTime | date: "yyyy-MM-dd hh:mm aaaaa'm'" }} | {{ metrics.itemCount }} of
54+
{{ metrics.totalItemCount }} items
55+
</span>
56+
}
57+
<div class="btn-group" role="group">
58+
<button class="btn btn-sm btn-outline-secondary btn-icon" data-test="scroll-top-btn" (click)="scrollGridTop()">
59+
<i class="mdi mdi-arrow-down mdi-rotate-180"></i>
60+
</button>
61+
<button class="btn btn-sm btn-outline-secondary btn-icon" data-test="scroll-bottom-btn" (click)="scrollGridBottom()">
62+
<i class="mdi mdi-arrow-down"></i>
63+
</button>
64+
</div>
65+
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="clear-filters" (click)="angularGrid.filterService.clearFilters()">
66+
Clear Filters
5867
</button>
59-
<button class="btn btn-sm btn-outline-secondary btn-icon" data-test="scroll-bottom-btn" (click)="scrollGridBottom()">
60-
<i class="mdi mdi-arrow-down"></i>
68+
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="clear-sorting" (click)="angularGrid.sortService.clearSorting()">
69+
Clear Sorting
70+
</button>
71+
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="set-dynamic-filter" (click)="setFiltersDynamically()">
72+
Set Filters Dynamically
73+
</button>
74+
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="set-dynamic-sorting" (click)="setSortingDynamically()">
75+
Set Sorting Dynamically
6176
</button>
62-
</div>
63-
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="clear-filters" (click)="angularGrid.filterService.clearFilters()">
64-
Clear Filters
65-
</button>
66-
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="clear-sorting" (click)="angularGrid.sortService.clearSorting()">
67-
Clear Sorting
68-
</button>
69-
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="set-dynamic-filter" (click)="setFiltersDynamically()">
70-
Set Filters Dynamically
71-
</button>
72-
<button class="btn btn-outline-secondary btn-sm btn-icon" data-test="set-dynamic-sorting" (click)="setSortingDynamically()">
73-
Set Sorting Dynamically
74-
</button>
7577

76-
<angular-slickgrid
77-
gridId="grid4"
78-
[columns]="columnDefinitions"
79-
[options]="gridOptions"
80-
[dataset]="dataset"
81-
(onAngularGridCreated)="angularGridReady($event.detail)"
82-
(onGridStateChanged)="gridStateChanged($event.detail)"
83-
(onBeforeGridDestroy)="saveCurrentGridState()"
84-
(onRowCountChanged)="refreshMetrics($event.detail.eventData, $event.detail.args)"
85-
>
86-
</angular-slickgrid>
87-
</div>
78+
<angular-slickgrid
79+
gridId="grid4"
80+
[columns]="columnDefinitions"
81+
[options]="gridOptions"
82+
[dataset]="dataset"
83+
(onAngularGridCreated)="angularGridReady($event.detail)"
84+
(onGridStateChanged)="gridStateChanged($event.detail)"
85+
(onBeforeGridDestroy)="saveCurrentGridState()"
86+
(onRowCountChanged)="refreshMetrics($event.detail.eventData, $event.detail.args)"
87+
>
88+
</angular-slickgrid>
89+
</div>

0 commit comments

Comments
 (0)