Skip to content

Commit 3a66a0d

Browse files
michael-smallmichael-small
committed
chore: update Angular to v21
1 parent db2d41b commit 3a66a0d

21 files changed

+4709
-3004
lines changed

‎apps/demo/project.json‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,8 @@
7272
"executor": "@nx/jest:jest",
7373
"outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
7474
"options": {
75-
"jestConfig": "apps/demo/jest.config.ts"
75+
"jestConfig": "apps/demo/jest.config.ts",
76+
"tsConfig": "apps/demo/tsconfig.spec.json"
7677
}
7778
},
7879
"e2e": {

‎apps/demo/src/app/flight-search-data-service-dynamic/flight-edit.component.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1-
import { CommonModule } from '@angular/common';
21
import { Component, Input, OnInit, ViewChild, inject } from '@angular/core';
32
import { FormsModule, NgForm } from '@angular/forms';
43
import { RouterModule } from '@angular/router';
54
import { Flight } from '../shared/flight';
65
import { FlightBookingStore } from './flight-booking.store';
76

87
@Component({
9-
imports: [CommonModule, RouterModule, FormsModule],
8+
imports: [RouterModule, FormsModule],
109
selector: 'demo-flight-edit',
1110
templateUrl: './flight-edit.component.html',
1211
})

‎apps/demo/src/app/flight-search-data-service-dynamic/flight-search.component.html‎

Lines changed: 17 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -47,24 +47,27 @@ <h2 class="title">Flight Search (Dynamic)</h2>
4747
</form>
4848

4949
<div>
50-
<b *ngIf="loading()">Loading ...</b>
50+
@if (loading()) {
51+
<b>Loading ...</b>
52+
}
5153
</div>
5254

5355
<div class="row">
54-
<div
55-
*ngFor="let f of flights()"
56-
class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-xl-3"
57-
>
58-
<demo-flight-card
59-
[item]="f"
60-
[selected]="selectedIds()[f.id]"
61-
(selectedChange)="updateBasket(f.id, $event)"
62-
>
63-
<a class="btn btn-default" [routerLink]="['../flight-edit-dynamic', f.id]"
64-
>Edit</a
56+
@for (f of flights(); track f) {
57+
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-xl-3">
58+
<demo-flight-card
59+
[item]="f"
60+
[selected]="selectedIds()[f.id]"
61+
(selectedChange)="updateBasket(f.id, $event)"
6562
>
66-
</demo-flight-card>
67-
</div>
63+
<a
64+
class="btn btn-default"
65+
[routerLink]="['../flight-edit-dynamic', f.id]"
66+
>Edit</a
67+
>
68+
</demo-flight-card>
69+
</div>
70+
}
6871
</div>
6972

7073
<pre>{{ selected() | json }}</pre>

‎apps/demo/src/app/flight-search-data-service-dynamic/flight-search.component.ts‎

Lines changed: 2 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,12 @@
1-
import { JsonPipe, NgForOf, NgIf } from '@angular/common';
1+
import { JsonPipe } from '@angular/common';
22
import { Component, inject } from '@angular/core';
33
import { FormsModule } from '@angular/forms';
44
import { RouterLink } from '@angular/router';
55
import { FlightCardComponent } from '../shared/flight-card.component';
66
import { FlightBookingStore } from './flight-booking.store';
77

88
@Component({
9-
imports: [
10-
NgIf,
11-
NgForOf,
12-
JsonPipe,
13-
FormsModule,
14-
FlightCardComponent,
15-
RouterLink,
16-
],
9+
imports: [JsonPipe, FormsModule, FlightCardComponent, RouterLink],
1710
selector: 'demo-flight-search',
1811
templateUrl: './flight-search.component.html',
1912
})

‎apps/demo/src/app/flight-search-data-service-simple/flight-edit-simple.component.ts‎

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,11 @@
1-
import { CommonModule } from '@angular/common';
21
import { Component, Input, OnInit, ViewChild, inject } from '@angular/core';
32
import { FormsModule, NgForm } from '@angular/forms';
43
import { RouterModule } from '@angular/router';
54
import { Flight } from '../shared/flight';
65
import { SimpleFlightBookingStore } from './flight-booking-simple.store';
76

87
@Component({
9-
imports: [CommonModule, RouterModule, FormsModule],
8+
imports: [RouterModule, FormsModule],
109
selector: 'demo-flight-edit-simple',
1110
templateUrl: './flight-edit-simple.component.html',
1211
})

‎apps/demo/src/app/flight-search-data-service-simple/flight-search-simple.component.html‎

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -14,12 +14,9 @@ <h2 class="title">Flight Search (Simple)</h2>
1414
</label>
1515
</div>
1616

17-
<div
18-
class="alert alert-warning"
19-
*ngIf="form?.controls?.['from']?.hasError('appCity')"
20-
>
21-
Invalid city!
22-
</div>
17+
@if (form?.controls?.['from']?.hasError('appCity')) {
18+
<div class="alert alert-warning">Invalid city!</div>
19+
}
2320

2421
<div class="form-group">
2522
<label
@@ -52,24 +49,27 @@ <h2 class="title">Flight Search (Simple)</h2>
5249
</form>
5350

5451
<div>
55-
<b *ngIf="loading()">Loading ...</b>
52+
@if (loading()) {
53+
<b>Loading ...</b>
54+
}
5655
</div>
5756

5857
<div class="row">
59-
<div
60-
*ngFor="let f of flights()"
61-
class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-xl-3"
62-
>
63-
<demo-flight-card
64-
[item]="f"
65-
[selected]="selectedIds()[f.id]"
66-
(selectedChange)="updateBasket(f.id, $event)"
67-
>
68-
<a class="btn btn-default" [routerLink]="['../flight-edit-simple', f.id]"
69-
>Edit</a
58+
@for (f of flights(); track f) {
59+
<div class="col-xs-12 col-sm-6 col-md-4 col-lg-4 col-xl-3">
60+
<demo-flight-card
61+
[item]="f"
62+
[selected]="selectedIds()[f.id]"
63+
(selectedChange)="updateBasket(f.id, $event)"
7064
>
71-
</demo-flight-card>
72-
</div>
65+
<a
66+
class="btn btn-default"
67+
[routerLink]="['../flight-edit-simple', f.id]"
68+
>Edit</a
69+
>
70+
</demo-flight-card>
71+
</div>
72+
}
7373
</div>
7474

7575
<pre>{{ selected() | json }}</pre>

‎apps/demo/src/app/flight-search-data-service-simple/flight-search-simple.component.ts‎

Lines changed: 1 addition & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { JsonPipe, NgForOf, NgIf } from '@angular/common';
1+
import { JsonPipe } from '@angular/common';
22
import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
33
import { FormsModule } from '@angular/forms';
44
import { MatButtonModule } from '@angular/material/button';
@@ -10,8 +10,6 @@ import { SimpleFlightBookingStore } from './flight-booking-simple.store';
1010

1111
@Component({
1212
imports: [
13-
NgIf,
14-
NgForOf,
1513
JsonPipe,
1614
FormsModule,
1715
FlightCardComponent,

‎apps/demo/src/app/shared/flight-card.component.html‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -7,12 +7,12 @@ <h2 class="title">{{ item.from }} - {{ item.to }}</h2>
77
<p>Flight-No.: #{{ item.id }}</p>
88
<p>Date: {{ item.date | date: 'dd.MM.yyyy HH:mm:ss' }}</p>
99
<p>
10-
<button class="btn btn-default" *ngIf="!selected" (click)="select()">
11-
Select
12-
</button>
13-
<button class="btn btn-default" *ngIf="selected" (click)="deselect()">
14-
Remove
15-
</button>
10+
@if (!selected) {
11+
<button class="btn btn-default" (click)="select()">Select</button>
12+
}
13+
@if (selected) {
14+
<button class="btn btn-default" (click)="deselect()">Remove</button>
15+
}
1616
<ng-content></ng-content>
1717
</p>
1818
</div>

‎apps/demo/src/app/todo-entity-resource/todo-entity-resource.component.ts‎

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
import { CommonModule } from '@angular/common';
21
import { Component, computed, effect, inject } from '@angular/core';
32
import { FormsModule } from '@angular/forms';
43
import { MatIcon } from '@angular/material/icon';
@@ -11,7 +10,6 @@ import { TodoEntityResourceStore } from './todo-entity-resource.store';
1110
selector: 'demo-todo-entity-resource',
1211
standalone: true,
1312
imports: [
14-
CommonModule,
1513
FormsModule,
1614
MatIcon,
1715
MatInputModule,

‎apps/demo/src/main.ts‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,9 @@
1+
import { provideZoneChangeDetection } from '@angular/core';
12
import { bootstrapApplication } from '@angular/platform-browser';
23
import { AppComponent } from './app/app.component';
34
import { appConfig } from './app/app.config';
45

5-
bootstrapApplication(AppComponent, appConfig).catch((err) =>
6-
console.error(err),
7-
);
6+
bootstrapApplication(AppComponent, {
7+
...appConfig,
8+
providers: [provideZoneChangeDetection(), ...appConfig.providers],
9+
}).catch((err) => console.error(err));

0 commit comments

Comments
 (0)