javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-18 19:21:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(slides): change slideChanged to change and add warning

Browse Source 
closes #759
This commit is contained in:
Brandy Carney
2015-12-16 14:36:13 -05:00
parent d7f481bf4c
commit 3e5d360ebf
4 changed files with 10 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

15
ionic/components/slides/slides.ts
View File

@ -1,4 +1,4 @@
import {Directive, Component, ElementRef, Host, EventEmitter} from 'angular2/core';
import {Directive, Component, ElementRef, Host, EventEmitter, Output} from 'angular2/core';
import {NgClass} from 'angular2/common';
import {Ion} from '../ion';
@ -34,7 +34,7 @@ import {Scroll} from '../scroll/scroll';
* ```ts
* @Page({
* template: `
* <ion-slides pager (slideChanged)="onSlideChanged($event)" loop="true" autoplay="true">
* <ion-slides pager (change)="onSlideChanged($event)" loop="true" autoplay="true">
* <ion-slide>
* <h3>Thank you for choosing the Awesome App!</h3>
* <p>
@ -65,7 +65,7 @@ import {Scroll} from '../scroll/scroll';
* @property {Boolean} [bounce] - whether the slides should bounce
* @property {Number} [index] - The slide index to start on
* @property [pager] - add this property to enable the slide pager
* @property {Any} [slideChanged] - expression to evaluate when a slide has been changed
* @property {Any} [change] - expression to evaluate when a slide has been changed
* @see {@link /docs/v2/components#slides Slides Component Docs}
*/
@Component({
@ -81,9 +81,6 @@ import {Scroll} from '../scroll/scroll';
'zoomDuration',
'zoomMax'
],
outputs: [
'slideChanged'
],
template:
'<div class="swiper-container">' +
'<div class="swiper-wrapper">' +
@ -94,18 +91,20 @@ import {Scroll} from '../scroll/scroll';
directives: [NgClass]
})
export class Slides extends Ion {
@Output() change:EventEmitter = new EventEmitter();
/**
* @private
* @param {ElementRef} elementRef TODO
*/
constructor(elementRef: ElementRef, config: Config) {
super(elementRef, config);
this.rapidUpdate = util.debounce(() => {
this.update();
}, 10);
this.slideChanged = new EventEmitter('slideChanged');
console.warn("(slideChanged) deprecated. Use (change) to track slide changes.");
}
/**
@ -151,7 +150,7 @@ export class Slides extends Ion {
return this.options.onSlideChangeStart && this.options.onSlideChangeStart(swiper);
};
options.onSlideChangeEnd = (swiper) => {
this.slideChanged.next(swiper);
this.change.next(swiper);
return this.options.onSlideChangeEnd && this.options.onSlideChangeEnd(swiper);
};
options.onLazyImageLoad = (swiper, slide, img) => {

2
ionic/components/slides/test/intro/index.ts
View File

@ -6,6 +6,6 @@ import {App} from 'ionic/ionic';
})
class MyApp {
onSlideChanged(slider) {
console.log('Slide chnaged', slider);
console.log('Slide changed', slider);
}
}

2
ionic/components/slides/test/intro/main.html
View File

@ -42,7 +42,7 @@
</ion-buttons>
<ion-title>Grid Icons</ion-title>
</ion-navbar>
<ion-slides pager (slideChanged)="onSlideChanged($event)" loop="true" autoplay="true">
<ion-slides pager (change)="onSlideChanged($event)" loop="true" autoplay="true">
<ion-slide>
<h3>Thank you for choosing the Awesome App!</h3>
<div id="logo">

2
ionic/components/slides/test/loop/main.html
View File

@ -1,4 +1,4 @@
<ion-slides loop="true" id="loopSlider" (slideChanged)="onSlideChanged($event)" pager>
<ion-slides loop="true" id="loopSlider" (change)="onSlideChanged($event)" pager>
<ion-slide *ngFor="#slide of slides" [ngClass]="slide.class">
{{ slide.name }}
</ion-slide>