Files
Brandy Carney 938864e8d0 refactor(button): add ion-button attribute and icon attributes to style buttons
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
2016-08-16 17:11:02 -04:00

81 lines
1.6 KiB
TypeScript

import { Component, ViewChild } from '@angular/core';
import { ionicBootstrap, InfiniteScroll, NavController } from '../../../../../src';
@Component({
templateUrl: 'main.html'
})
class E2EPage1 {
@ViewChild(InfiniteScroll) infiniteScroll: InfiniteScroll;
items: number[] = [];
enabled: boolean = true;
constructor(public navCtrl: NavController) {
for (var i = 0; i < 30; i++) {
this.items.push( this.items.length );
}
}
doInfinite(infiniteScroll: InfiniteScroll) {
console.log('Begin async operation');
getAsyncData().then(newData => {
for (var i = 0; i < newData.length; i++) {
this.items.push( this.items.length );
}
console.log('Finished receiving data, async operation complete');
infiniteScroll.complete();
if (this.items.length > 90) {
this.enabled = false;
infiniteScroll.enable(this.enabled);
}
});
}
goToPage2() {
this.navCtrl.push(E2EPage2);
}
toggleInfiniteScroll() {
this.enabled = !this.enabled;
this.infiniteScroll.enable(this.enabled);
}
}
@Component({
template: '<ion-content><button ion-button (click)="navCtrl.pop()">Pop</button></ion-content>'
})
class E2EPage2 {
constructor(public navCtrl: NavController) {}
}
@Component({
template: '<ion-nav [root]="root"></ion-nav>'
})
class E2EApp {
root = E2EPage1;
}
ionicBootstrap(E2EApp);
function getAsyncData(): Promise<any[]> {
// async return mock data
return new Promise(resolve => {
setTimeout(() => {
let data: number[] = [];
for (var i = 0; i < 30; i++) {
data.push(i);
}
resolve(data);
}, 500);
});
}