mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-20 04:14:21 +08:00
@ -1,46 +1,6 @@
|
||||
import {App, IonicApp} from 'ionic/ionic';
|
||||
import {Http} from 'angular2/http';
|
||||
import {App} from 'ionic/ionic';
|
||||
|
||||
@App({
|
||||
templateUrl: 'main.html',
|
||||
})
|
||||
class ApiDemoApp {
|
||||
constructor(private app: IonicApp, http: Http) {
|
||||
this.http = http;
|
||||
this.extraOptions = {
|
||||
loop: true
|
||||
};
|
||||
this.images = [];
|
||||
|
||||
let tags = "amsterdam";
|
||||
let FLICKR_API_KEY = '504fd7414f6275eb5b657ddbfba80a2c';
|
||||
let baseUrl = 'https://api.flickr.com/services/rest/';
|
||||
|
||||
this.http.get(baseUrl + '?method=flickr.groups.pools.getPhotos&group_id=1463451@N25&safe_search=1&api_key=' + FLICKR_API_KEY + '&format=json&nojsoncallback=1&tags=' + tags).subscribe(
|
||||
data => {
|
||||
let val = data.json();
|
||||
this.images = val.photos.photo.slice(0, 20);
|
||||
setTimeout(() => {
|
||||
this.slider.update();
|
||||
});
|
||||
},
|
||||
err => console.log(err),
|
||||
() => console.log('complete')
|
||||
);
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
setTimeout(() => {
|
||||
this.slider = this.app.getComponent('slider');
|
||||
console.log('Got slider', this.slider);
|
||||
});
|
||||
}
|
||||
|
||||
getImageUrl(item) {
|
||||
return "http://farm"+ item.farm +".static.flickr.com/"+ item.server +"/"+ item.id +"_"+ item.secret + "_z.jpg";
|
||||
}
|
||||
|
||||
doRefresh() {
|
||||
console.log('DOREFRESH')
|
||||
}
|
||||
}
|
||||
class ApiDemoApp {}
|
||||
|
@ -1,13 +1,5 @@
|
||||
<ion-slides [options]="extraOptions" id="slider" style="background-color: black" zoom>
|
||||
<ion-slide *ngFor="#image of images">
|
||||
<img data-src="{{getImageUrl(image)}}" slide-lazy>
|
||||
<ion-slides loop="true" style="background-color: black">
|
||||
<ion-slide *ngFor="#image of [1,2,3,4,5]">
|
||||
<img data-src="./slide{{image}}.jpeg">
|
||||
</ion-slide>
|
||||
</ion-slides>
|
||||
<style>
|
||||
|
||||
ion-scroll {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
BIN
demos/slides/slide1.jpeg
Normal file
BIN
demos/slides/slide1.jpeg
Normal file
Binary file not shown.
After Width: | Height: | Size: 117 KiB |
BIN
demos/slides/slide2.jpeg
Normal file
BIN
demos/slides/slide2.jpeg
Normal file
Binary file not shown.
After Width: | Height: | Size: 282 KiB |
BIN
demos/slides/slide3.jpeg
Normal file
BIN
demos/slides/slide3.jpeg
Normal file
Binary file not shown.
After Width: | Height: | Size: 427 KiB |
BIN
demos/slides/slide4.jpeg
Normal file
BIN
demos/slides/slide4.jpeg
Normal file
Binary file not shown.
After Width: | Height: | Size: 273 KiB |
BIN
demos/slides/slide5.jpeg
Normal file
BIN
demos/slides/slide5.jpeg
Normal file
Binary file not shown.
After Width: | Height: | Size: 154 KiB |
Reference in New Issue
Block a user