add loading buttons
This commit is contained in:
parent
9c9ee37ae1
commit
3040734719
@ -135,5 +135,13 @@
|
||||
<button pButton pRipple type="button" icon="pi pi-heart" class="p-button-rounded p-button-help p-button-outlined mr-2 mb-2"></button>
|
||||
<button pButton pRipple type="button" icon="pi pi-times" class="p-button-rounded p-button-danger p-button-outlined mr-2 mb-2"></button>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h5>Loading</h5>
|
||||
<p-button label="Search" icon="pi pi-search" class="mr-2 mb-2" [loading]="loading[0]" (onClick)="load(0)"></p-button>
|
||||
<p-button label="Search" icon="pi pi-search" iconPos="right" class="mr-2 mb-2" [loading]="loading[1]" (onClick)="load(1)"></p-button>
|
||||
<p-button icon="pi pi-search" class="mr-2 mb-2" [loading]="loading[2]" (onClick)="load(2)"></p-button>
|
||||
<p-button label="Search" class="mr-2 mb-2" [loading]="loading[3]" (onClick)="load(3)"></p-button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -8,6 +8,8 @@ export class ButtonDemoComponent implements OnInit {
|
||||
|
||||
items: MenuItem[];
|
||||
|
||||
loading = [false, false, false, false]
|
||||
|
||||
ngOnInit() {
|
||||
this.items = [
|
||||
{label: 'Update', icon: 'pi pi-refresh'},
|
||||
@ -17,4 +19,9 @@ export class ButtonDemoComponent implements OnInit {
|
||||
{label: 'Setup', icon: 'pi pi-cog'}
|
||||
];
|
||||
}
|
||||
|
||||
load(index) {
|
||||
this.loading[index] = true;
|
||||
setTimeout(() => this.loading[index] = false, 1000);
|
||||
}
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user