mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-19 19:57:22 +08:00
possible to pass elementRef to Animation
This commit is contained in:
@ -25,7 +25,7 @@ let AnimationRegistry = {};
|
|||||||
|
|
||||||
export class Animation {
|
export class Animation {
|
||||||
|
|
||||||
constructor(el) {
|
constructor(ele) {
|
||||||
this._el = [];
|
this._el = [];
|
||||||
this._chld = [];
|
this._chld = [];
|
||||||
this._ani = [];
|
this._ani = [];
|
||||||
@ -39,27 +39,44 @@ export class Animation {
|
|||||||
this._plays = [];
|
this._plays = [];
|
||||||
this._finishes = [];
|
this._finishes = [];
|
||||||
|
|
||||||
this.elements(el);
|
this.elements(ele);
|
||||||
}
|
}
|
||||||
|
|
||||||
elements(el) {
|
elements(ele) {
|
||||||
if (el) {
|
if (ele) {
|
||||||
if (typeof el === 'string') {
|
if (typeof ele === 'string') {
|
||||||
el = document.querySelectorAll(el);
|
// string query selector
|
||||||
|
ele = document.querySelectorAll(ele);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (el.length) {
|
if (ele.length) {
|
||||||
for (let i = 0; i < el.length; i++) {
|
// array of elements
|
||||||
this._el.push(el[i]);
|
for (let i = 0; i < ele.length; i++) {
|
||||||
|
this.addElement(ele[i]);
|
||||||
}
|
}
|
||||||
|
|
||||||
} else if (el.nodeType) {
|
} else {
|
||||||
this._el.push(el);
|
// single element
|
||||||
|
this.addElement(ele);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return this;
|
return this;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
addElement(ele) {
|
||||||
|
// ensure only HTML Element nodes
|
||||||
|
if (ele) {
|
||||||
|
if (ele.nativeElement) {
|
||||||
|
// angular ElementRef
|
||||||
|
ele = ele.nativeElement;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (ele.nodeType === 1) {
|
||||||
|
this._el.push(ele);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
parent(parentAnimation) {
|
parent(parentAnimation) {
|
||||||
this._parent = parentAnimation;
|
this._parent = parentAnimation;
|
||||||
return this;
|
return this;
|
||||||
|
@ -39,7 +39,7 @@ import * as dom from '../../util/dom';
|
|||||||
})
|
})
|
||||||
export class Navbar {
|
export class Navbar {
|
||||||
constructor(item: ViewItem, elementRef: ElementRef) {
|
constructor(item: ViewItem, elementRef: ElementRef) {
|
||||||
this.ele = elementRef.nativeElement;
|
this.eleRef = elementRef;
|
||||||
this.itemEles = [];
|
this.itemEles = [];
|
||||||
item.navbarView(this);
|
item.navbarView(this);
|
||||||
|
|
||||||
@ -48,40 +48,40 @@ export class Navbar {
|
|||||||
}
|
}
|
||||||
|
|
||||||
element() {
|
element() {
|
||||||
return this.ele;
|
return this.eleRef;
|
||||||
}
|
}
|
||||||
|
|
||||||
backButtonElement(ele) {
|
backButtonElement(eleRef) {
|
||||||
if (arguments.length) {
|
if (arguments.length) {
|
||||||
this._bbEle = ele;
|
this._bbEle = eleRef;
|
||||||
}
|
}
|
||||||
return this._bbEle;
|
return this._bbEle;
|
||||||
}
|
}
|
||||||
|
|
||||||
backButtonTextElement(ele) {
|
backButtonTextElement(eleRef) {
|
||||||
if (arguments.length) {
|
if (arguments.length) {
|
||||||
this._bbTxEle = ele;
|
this._bbTxEle = eleRef;
|
||||||
}
|
}
|
||||||
return this._bbTxEle;
|
return this._bbTxEle;
|
||||||
}
|
}
|
||||||
|
|
||||||
titleElement(ele) {
|
titleElement(eleRef) {
|
||||||
if (arguments.length) {
|
if (arguments.length) {
|
||||||
this._nbTlEle = ele;
|
this._nbTlEle = eleRef;
|
||||||
}
|
}
|
||||||
return this._nbTlEle;
|
return this._nbTlEle;
|
||||||
}
|
}
|
||||||
|
|
||||||
itemElements(ele) {
|
itemElements(eleRef) {
|
||||||
if (arguments.length) {
|
if (arguments.length) {
|
||||||
this.itemEles.push(ele);
|
this.itemEles.push(eleRef);
|
||||||
}
|
}
|
||||||
return this.itemEles;
|
return this.itemEles;
|
||||||
}
|
}
|
||||||
|
|
||||||
titleText(ele) {
|
titleText(eleRef) {
|
||||||
if (arguments.length) {
|
if (arguments.length) {
|
||||||
this._ttTxt.push(ele);
|
this._ttTxt.push(eleRef);
|
||||||
}
|
}
|
||||||
return this._ttTxt;
|
return this._ttTxt;
|
||||||
}
|
}
|
||||||
@ -89,7 +89,7 @@ export class Navbar {
|
|||||||
alignTitle() {
|
alignTitle() {
|
||||||
// called after the navbar/title has had a moment to
|
// called after the navbar/title has had a moment to
|
||||||
// finish rendering in their correct locations
|
// finish rendering in their correct locations
|
||||||
const navbarEle = this.ele;
|
const navbarEle = this.eleRef.nativeElement;
|
||||||
const titleEle = this._ttEle || (this._ttEle = navbarEle.querySelector('ion-title'));
|
const titleEle = this._ttEle || (this._ttEle = navbarEle.querySelector('ion-title'));
|
||||||
|
|
||||||
// don't bother if there's no title element
|
// don't bother if there's no title element
|
||||||
@ -125,7 +125,7 @@ export class Navbar {
|
|||||||
|
|
||||||
didEnter() {
|
didEnter() {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
const titleEle = this._ttEle || (this._ttEle = this.ele.querySelector('ion-title'));
|
const titleEle = this._ttEle || (this._ttEle = this.eleRef.nativeElement.querySelector('ion-title'));
|
||||||
//this.titleText((titleEle && titleEle.textContent) || '');
|
//this.titleText((titleEle && titleEle.textContent) || '');
|
||||||
}, 32);
|
}, 32);
|
||||||
}
|
}
|
||||||
@ -140,7 +140,7 @@ export class Navbar {
|
|||||||
class BackButton {
|
class BackButton {
|
||||||
constructor(@Parent() navbar: Navbar, item: ViewItem, elementRef: ElementRef) {
|
constructor(@Parent() navbar: Navbar, item: ViewItem, elementRef: ElementRef) {
|
||||||
this.item = item;
|
this.item = item;
|
||||||
navbar.backButtonElement(elementRef.nativeElement);
|
navbar.backButtonElement(elementRef);
|
||||||
}
|
}
|
||||||
|
|
||||||
goBack(ev) {
|
goBack(ev) {
|
||||||
@ -155,7 +155,7 @@ class BackButton {
|
|||||||
})
|
})
|
||||||
class BackButtonText {
|
class BackButtonText {
|
||||||
constructor(@Parent() navbar: Navbar, elementRef: ElementRef) {
|
constructor(@Parent() navbar: Navbar, elementRef: ElementRef) {
|
||||||
navbar.backButtonTextElement(elementRef.nativeElement);
|
navbar.backButtonTextElement(elementRef);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -164,7 +164,7 @@ class BackButtonText {
|
|||||||
})
|
})
|
||||||
class Title {
|
class Title {
|
||||||
constructor(@Parent() navbar: Navbar, elementRef: ElementRef) {
|
constructor(@Parent() navbar: Navbar, elementRef: ElementRef) {
|
||||||
navbar.titleElement(elementRef.nativeElement);
|
navbar.titleElement(elementRef);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -173,7 +173,7 @@ class Title {
|
|||||||
})
|
})
|
||||||
class NavbarItem {
|
class NavbarItem {
|
||||||
constructor(@Parent() navbar: Navbar, elementRef: ElementRef) {
|
constructor(@Parent() navbar: Navbar, elementRef: ElementRef) {
|
||||||
navbar.itemElements(elementRef.nativeElement);
|
navbar.itemElements(elementRef);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user