Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit af867a1

Browse files
committed
clean codes
1 parent 5ac0f69 commit af867a1

File tree

14 files changed

+329
-200
lines changed

14 files changed

+329
-200
lines changed

‎ui/apps/todolist/project.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,8 @@
6565
"buildTarget": "todolist:build:development"
6666
}
6767
},
68-
"defaultConfiguration": "development"
68+
"defaultConfiguration": "development",
69+
"continuous": true
6970
},
7071
"extract-i18n": {
7172
"executor": "@angular-devkit/build-angular:extract-i18n",

‎ui/apps/todolist/src/app/app.component.html

Lines changed: 36 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -27,51 +27,53 @@
2727
</div>
2828

2929
<mat-nav-list>
30-
<a mat-list-item *ngFor="let link of links" [routerLink]="[link.path]">
31-
<mat-icon matListIcon>{{link.icon}}</mat-icon>
32-
<span>{{link.label}}</span>
33-
</a>
30+
@for (link of links; track link) {
31+
<a mat-list-item [routerLink]="[link.path]">
32+
<mat-icon matListIcon>{{link.icon}}</mat-icon>
33+
<span>{{link.label}}</span>
34+
</a>
35+
}
3436
</mat-nav-list>
3537
<!-- <mat-tab-group>
36-
<mat-tab label="Users">
37-
<mat-nav-list>
38-
<mat-list-item *ngFor="let user of users">
39-
<mat-icon matListAvatar svgIcon="avatars:{{user.avatar}}" ></mat-icon>
40-
<span>{{user.name}}</span>
41-
</mat-list-item>
42-
</mat-nav-list>
43-
</mat-tab>
44-
<mat-tab label="Settings">
45-
<span>Settings</span>
46-
</mat-tab>
47-
</mat-tab-group> -->
48-
</mat-sidenav>
49-
<div class="content"
38+
<mat-tab label="Users">
39+
<mat-nav-list>
40+
<mat-list-item *ngFor="let user of users">
41+
<mat-icon matListAvatar svgIcon="avatars:{{user.avatar}}" class="avatar"></mat-icon>
42+
<span>{{user.name}}</span>
43+
</mat-list-item>
44+
</mat-nav-list>
45+
</mat-tab>
46+
<mat-tab label="Settings">
47+
<span>Settings</span>
48+
</mat-tab>
49+
</mat-tab-group> -->
50+
</mat-sidenav>
51+
<div class="content"
5052
fxFlex
5153
fxFlex.gt-sm="66"
5254
fxLayout="row space-around"
5355
fxLayoutGap="15px"
5456
fxLayout.sm="column"
5557
fxLayoutGap.sm="0px">
5658

57-
<!-- <mat-card fxFlex="80">
58-
<mat-icon svgIcon="avatars:{{selectedUser.avatar}}" class="avatar"></mat-icon>
59-
<h2>{{selectedUser.name}}</h2>
60-
<p>{{selectedUser.details}}</p>
61-
</mat-card>
59+
<!-- <mat-card fxFlex="80">
60+
<mat-icon svgIcon="avatars:{{selectedUser.avatar}}" class="avatar"></mat-icon>
61+
<h2>{{selectedUser.name}}</h2>
62+
<p>{{selectedUser.details}}</p>
63+
</mat-card>
6264
63-
<mat-card fxFlex fxLayout="column" fxLayoutGap="14px">
64-
<mat-slide-toggle [(ngModel)]="selectedUser.isAdmin">Is Admin?</mat-slide-toggle>
65-
<mat-slide-toggle [(ngModel)]="selectedUser.isCool">Is Cool?</mat-slide-toggle>
66-
</mat-card> -->
67-
<router-outlet fxFlex>
68-
</router-outlet>
65+
<mat-card fxFlex fxLayout="column" fxLayoutGap="14px">
66+
<mat-slide-toggle [(ngModel)]="selectedUser.isAdmin">Is Admin?</mat-slide-toggle>
67+
<mat-slide-toggle [(ngModel)]="selectedUser.isCool">Is Cool?</mat-slide-toggle>
68+
</mat-card> -->
69+
<router-outlet fxFlex>
70+
</router-outlet>
6971

70-
</div>
71-
</mat-sidenav-container>
72-
<mat-menu #themeMenu x-position="before">
73-
<button mat-menu-item (click)="isDarkTheme = !isDarkTheme">Toggle Theme</button>
74-
</mat-menu>
72+
</div>
73+
</mat-sidenav-container>
74+
<mat-menu #themeMenu x-position="before">
75+
<button mat-menu-item (click)="isDarkTheme = !isDarkTheme">Toggle Theme</button>
76+
</mat-menu>
7577

7678

7779
</div>

‎ui/apps/todolist/src/app/auth/signin/signin.component.html

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -7,25 +7,33 @@
77
<input type="text" matInput #userControl="ngModel" placeholder="Username" type="text" maxlength="30" name="username" [(ngModel)]="username"
88
required>
99
</mat-form-field>
10-
<mat-hint fxLayoutAlign="start" *ngIf="userControl.invalid && !userControl.pristine">
11-
<span *ngIf="passControl.hasError('required')" class="tc-red-600">username is required</span>
12-
</mat-hint>
10+
@if (userControl.invalid && !userControl.pristine) {
11+
<mat-hint fxLayoutAlign="start">
12+
@if (passControl.hasError('required')) {
13+
<span class="tc-red-600">username is required</span>
14+
}
15+
</mat-hint>
16+
}
1317
</p>
1418

1519
<p>
1620
<mat-form-field fxFlex>
1721
<input type="password" matInput #passControl="ngModel" placeholder="Password" type="password" name="password" [(ngModel)]="password"
1822
required>
19-
<mat-error fxLayoutAlign="start" *ngIf="passControl.hasError('required')">
20-
Password is <strong>Required</strong>.
21-
</mat-error>
23+
@if (passControl.hasError('required')) {
24+
<mat-error fxLayoutAlign="start">
25+
Password is <strong>Required</strong>.
26+
</mat-error>
27+
}
2228
</mat-form-field>
2329

2430
</p>
2531

26-
<p *ngIf="errorMessage" class="loginError">
27-
{{ errorMessage }}
28-
</p>
32+
@if (errorMessage) {
33+
<p class="loginError">
34+
{{ errorMessage }}
35+
</p>
36+
}
2937

3038
<p class="loginButtons">
3139
<button type="submit" color="accent" mat-button md-raised-button fxFlex [disabled]="loginForm.invalid||loginForm.pending">Login</button>

‎ui/apps/todolist/src/app/dialog/dialog.component.html

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,9 @@ <h3>Add User Dialog</h3>
55
<mat-icon svgIcon="avatars:{{selectedAvatar}}" class="avatar"></mat-icon>
66
<mat-form-field>
77
<mat-select name="avatar" fxFlex placeholder="Avatar" [(ngModel)]="selectedAvatar">
8-
<mat-option *ngFor="let avatar of avatars; let i = index;" [value]="avatar">Avatar - {{i + 1}}</mat-option>
8+
@for (avatar of avatars; track avatar; let i = $index) {
9+
<mat-option [value]="avatar">Avatar - {{i + 1}}</mat-option>
10+
}
911
</mat-select>
1012
</mat-form-field>
1113
</div>

‎ui/apps/todolist/src/app/http-client.spec.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -24,8 +24,8 @@ describe('HttpClient testing', () => {
2424
});
2525

2626
// Inject the http service and test controller for each test
27-
httpClient = TestBed.get(HttpClient);
28-
httpTestingController = TestBed.get(HttpTestingController);
27+
httpClient = TestBed.inject(HttpClient);
28+
httpTestingController = TestBed.inject(HttpTestingController);
2929
});
3030
afterEach(() => {
3131
// After every test, assert that there are no more pending requests.

‎ui/apps/todolist/src/app/post/post-details/comment/comment-form.component.html

Lines changed: 6 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4,8 +4,12 @@
44
<mat-form-field fxFlex>
55
<textarea matInput name="content" id="content" [formControl]="content" rows="8" required>
66
</textarea>
7-
<mat-error align="start" *ngIf="content.hasError('required')">Comment is required</mat-error>
8-
<mat-error align="start" *ngIf="content.hasError('minlength')">At least 10 chars</mat-error>
7+
@if (content.hasError('required')) {
8+
<mat-error align="start">Comment is required</mat-error>
9+
}
10+
@if (content.hasError('minlength')) {
11+
<mat-error align="start">At least 10 chars</mat-error>
12+
}
913
</mat-form-field>
1014
</p>
1115
<p>
Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,7 @@
1-
<mat-nav-list *ngIf="comments">
2-
<app-comment-list-item [comment]="c" *ngFor="let c of comments"></app-comment-list-item>
3-
</mat-nav-list>
1+
@if (comments) {
2+
<mat-nav-list>
3+
@for (c of comments; track c) {
4+
<app-comment-list-item [comment]="c"></app-comment-list-item>
5+
}
6+
</mat-nav-list>
7+
}
Lines changed: 18 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,24 +1,26 @@
1-
<mat-card fxFlex="50" *ngFor="let post of posts">
1+
@for (post of posts; track post) {
2+
<mat-card fxFlex="50">
23
<mat-card-header>
3-
<mat-card-title>
4-
<h1 class="mat-heading">{{post.title}}</h1>
5-
</mat-card-title>
6-
<mat-card-subtitle>{{post.author?.username||'user'}} &bull; {{post.createdDate|date:'short'}}</mat-card-subtitle>
4+
<mat-card-title>
5+
<h1 class="mat-heading">{{post.title}}</h1>
6+
</mat-card-title>
7+
<mat-card-subtitle>{{post.author?.username||'user'}} &bull; {{post.createdDate|date:'short'}}</mat-card-subtitle>
78
</mat-card-header>
89
<!-- <img matCardImage src="Card wide image source"> -->
910
<!-- <mat-card-content>
10-
Text content
11-
</mat-card-content> -->
12-
<mat-card-actions align="start">
13-
<a mat-button [routerLink]="['/post', 'edit', post.id]">
14-
edit
15-
</a>
16-
<a mat-button [routerLink]="['/post', 'view', post.id]">view</a>
17-
</mat-card-actions>
18-
<!-- <mat-card-footer>
19-
Footer
20-
</mat-card-footer> -->
11+
Text content
12+
</mat-card-content> -->
13+
<mat-card-actions align="start">
14+
<a mat-button [routerLink]="['/post', 'edit', post.id]">
15+
edit
16+
</a>
17+
<a mat-button [routerLink]="['/post', 'view', post.id]">view</a>
18+
</mat-card-actions>
19+
<!-- <mat-card-footer>
20+
Footer
21+
</mat-card-footer> -->
2122
</mat-card>
23+
}
2224
<button mat-fab (click)="addPost()" class="fab-bottom-right">
2325
<mat-icon>add</mat-icon>
2426
</button>
Lines changed: 37 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -1,38 +1,44 @@
11
<form id="form" #f="ngForm" name="form" class="form" (ngSubmit)="submit()">
2-
<p>
3-
<mat-form-field fxFlex>
4-
<input matInput
5-
id="title"
6-
name="title"
7-
#title="ngModel"
8-
[(ngModel)]="post.title"
9-
required/>
10-
<mat-error align="start" *ngIf="title.hasError('required')">
11-
Post Title is required
12-
</mat-error>
13-
</mat-form-field>
14-
</p>
152
<p>
16-
<mat-form-field fxFlex>
17-
<textarea matInput
18-
#content="ngModel"
19-
name="content"
20-
id="content"
21-
[(ngModel)]="post.content"
22-
rows="8"
23-
required
24-
minlength="10">
25-
</textarea>
26-
<mat-error align="start" *ngIf="content.hasError('required')">
27-
Post Content is required
28-
</mat-error>
29-
<mat-error align="start" *ngIf="content.hasError('minlength')">
30-
At least 10 chars
31-
</mat-error>
32-
</mat-form-field>
3+
<mat-form-field fxFlex>
4+
<input matInput
5+
id="title"
6+
name="title"
7+
#title="ngModel"
8+
[(ngModel)]="post.title"
9+
required/>
10+
@if (title.hasError('required')) {
11+
<mat-error align="start">
12+
Post Title is required
13+
</mat-error>
14+
}
15+
</mat-form-field>
3316
</p>
3417
<p>
35-
<button mat-button mat-raised-button color="primary" type="submit" [disabled]="f.invalid || f.pending"> {{'save'}}</button>
18+
<mat-form-field fxFlex>
19+
<textarea matInput
20+
#content="ngModel"
21+
name="content"
22+
id="content"
23+
[(ngModel)]="post.content"
24+
rows="8"
25+
required
26+
minlength="10">
27+
</textarea>
28+
@if (content.hasError('required')) {
29+
<mat-error align="start">
30+
Post Content is required
31+
</mat-error>
32+
}
33+
@if (content.hasError('minlength')) {
34+
<mat-error align="start">
35+
At least 10 chars
36+
</mat-error>
37+
}
38+
</mat-form-field>
39+
</p>
40+
<p>
41+
<button mat-button mat-raised-button color="primary" type="submit" [disabled]="f.invalid || f.pending"> {{'save'}}</button>
3642
</p>
3743

3844
</form>

‎ui/apps/todolist/src/app/post/shared/post.service.spec.ts

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -45,9 +45,9 @@ describe('Service: Post', () => {
4545

4646
// Inject the http, test controller, and service-under-test
4747
// as they will be referenced by each test.
48-
httpClient = TestBed.get(HttpClient);
49-
httpTestingController = TestBed.get(HttpTestingController);
50-
postService = TestBed.get(PostService);
48+
httpClient = TestBed.inject(HttpClient);
49+
httpTestingController = TestBed.inject(HttpTestingController);
50+
postService = TestBed.inject(PostService);
5151
});
5252

5353
afterEach(() => {
@@ -64,7 +64,7 @@ describe('Service: Post', () => {
6464

6565
beforeEach(() => {
6666
expectedPosts = posts;
67-
postService = TestBed.get(PostService);
67+
postService = TestBed.inject(PostService);
6868
});
6969

7070
it('should get posts...', () => {
@@ -116,7 +116,7 @@ describe('Service: Post', () => {
116116

117117
beforeEach(() => {
118118
expectedPost = posts[0];
119-
postService = TestBed.get(PostService);
119+
postService = TestBed.inject(PostService);
120120
});
121121

122122
it('should get post...', () => {
@@ -152,7 +152,7 @@ describe('Service: Post', () => {
152152

153153
beforeEach(() => {
154154
expectedPost = posts[0];
155-
postService = TestBed.get(PostService);
155+
postService = TestBed.inject(PostService);
156156
});
157157

158158
it('should save post...', () => {
@@ -174,7 +174,7 @@ describe('Service: Post', () => {
174174

175175
beforeEach(() => {
176176
expectedPost = posts[0];
177-
postService = TestBed.get(PostService);
177+
postService = TestBed.inject(PostService);
178178
});
179179

180180
it('should update post...', () => {
@@ -209,7 +209,7 @@ describe('Service: Post', () => {
209209

210210
beforeEach(() => {
211211
expectedPost = posts[0];
212-
postService = TestBed.get(PostService);
212+
postService = TestBed.inject(PostService);
213213
});
214214

215215
it('should delete post...', () => {

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /