-
Notifications
You must be signed in to change notification settings - Fork 3.8k
/
loading.ts
47 lines (44 loc) · 1.17 KB
/
loading.ts
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
import { Component } from '@angular/core';
@Component({
selector: 'nz-demo-button-loading',
template: `
<button nz-button nzType="primary" nzLoading>
<span nz-icon nzType="poweroff"></span>
Loading
</button>
<button nz-button nzType="primary" nzSize="small" nzLoading>Loading</button>
<br />
<button nz-button nzType="primary" (click)="loadOne()" [nzLoading]="isLoadingOne">Click me!</button>
<button nz-button nzType="primary" (click)="loadTwo()" [nzLoading]="isLoadingTwo">
<span nz-icon nzType="poweroff"></span>
Click me!
</button>
<br />
<button nz-button nzLoading nzShape="circle"></button>
<button nz-button nzLoading nzType="primary" nzShape="circle"></button>
`,
styles: [
`
[nz-button] {
margin-right: 8px;
margin-bottom: 12px;
}
`
]
})
export class NzDemoButtonLoadingComponent {
isLoadingOne = false;
isLoadingTwo = false;
loadOne(): void {
this.isLoadingOne = true;
setTimeout(() => {
this.isLoadingOne = false;
}, 5000);
}
loadTwo(): void {
this.isLoadingTwo = true;
setTimeout(() => {
this.isLoadingTwo = false;
}, 5000);
}
}