mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 12:29:55 +08:00
938864e8d0
BREAKING CHANGES: - `<button>` becomes `<button ion-button>` - `<a button>` becomes `<a ion-button>` - `<button ion-item>` does not get the `ion-button` attribute - Buttons inside of `<ion-item-options>` do get the `ion-button` attribute - Removed the `category` attribute, this should be passed in `ion-button` instead. - Button attributes added for icons in buttons: `icon-only`, `icon-left`, and `icon-right` closes #7466
69 lines
1.6 KiB
HTML
69 lines
1.6 KiB
HTML
<ion-header>
|
|
|
|
<ion-navbar>
|
|
<ion-title>Loading</ion-title>
|
|
</ion-navbar>
|
|
|
|
</ion-header>
|
|
|
|
|
|
<ion-content class="outer-content">
|
|
|
|
<ion-list>
|
|
<ion-list-header>
|
|
Spinner Loading Indicators
|
|
</ion-list-header>
|
|
<button ion-item (click)="presentLoadingIos()">
|
|
<ion-spinner item-left name="ios"></ion-spinner>
|
|
Show iOS
|
|
</button>
|
|
<button ion-item (click)="presentLoadingDots()">
|
|
<ion-spinner item-left name="dots"></ion-spinner>
|
|
Show Dots
|
|
</button>
|
|
<button ion-item (click)="presentLoadingBubbles()">
|
|
<ion-spinner item-left name="bubbles"></ion-spinner>
|
|
Show Bubbles
|
|
</button>
|
|
<button ion-item (click)="presentLoadingCircles()">
|
|
<ion-spinner item-left name="circles"></ion-spinner>
|
|
Show Circles
|
|
</button>
|
|
<button ion-item (click)="presentLoadingCrescent()">
|
|
<ion-spinner item-left name="crescent"></ion-spinner>
|
|
Show Crescent
|
|
</button>
|
|
<button ion-item (click)="presentLoadingDefault()">
|
|
<ion-spinner item-left></ion-spinner>
|
|
Show Default
|
|
</button>
|
|
</ion-list>
|
|
|
|
<ion-list>
|
|
<ion-list-header>
|
|
Custom Loading Indicators
|
|
</ion-list-header>
|
|
<button ion-item (click)="presentLoadingCustom()">
|
|
Show Custom
|
|
</button>
|
|
<button ion-item (click)="presentLoadingText()">
|
|
Show Text Only
|
|
</button>
|
|
</ion-list>
|
|
|
|
</ion-content>
|
|
|
|
|
|
<ion-footer>
|
|
|
|
<ion-toolbar>
|
|
<ion-buttons end>
|
|
<button ion-button icon-right (click)="goToPage2()">
|
|
Show Loading and Navigate
|
|
<ion-icon name="arrow-forward"></ion-icon>
|
|
</button>
|
|
</ion-buttons>
|
|
</ion-toolbar>
|
|
|
|
</ion-footer>
|