feat(tappable): auto add tappable attribute for ion-item clicks

This commit is contained in:
Adam Bradley
2016-11-16 09:10:28 -06:00
parent 12b8157e1e
commit 5c4838b813
3 changed files with 15 additions and 5 deletions

View File

@@ -339,6 +339,17 @@ export class Item extends Ion {
this._setName(elementRef);
this._shouldHaveReorder = !!reorder;
this.id = form.nextId().toString();
// auto add "tappable" attribute to ion-item components that have a click listener
if (!(<any>renderer).orgListen) {
(<any>renderer).orgListen = renderer.listen;
renderer.listen = function(renderElement: HTMLElement, name: string, callback: Function): Function {
if (name === 'click' && renderElement.setAttribute) {
renderElement.setAttribute('tappable', '');
}
return (<any>renderer).orgListen(renderElement, name, callback);
};
}
}
/**

View File

@@ -53,7 +53,7 @@ export class MyCmpTest {
<ion-list-header>
{{title}}
</ion-list-header>
<button ion-item class="e2eFrom1To2" (click)="pushFullPage()">Push to FullPage</button>
<ion-item class="e2eFrom1To2" (click)="pushFullPage()">Push to FullPage</ion-item>
<button ion-item (click)="pushPrimaryHeaderPage()">Push to PrimaryHeaderPage</button>
<button ion-item (click)="pushRedirect()">Push to Redirect</button>
<button ion-item (click)="pushTabsPage()">Push to Tabs Page</button>

View File

@@ -160,9 +160,8 @@ export const isActivatable = function (ele: HTMLElement) {
return true;
}
let attributes = ele.attributes;
for (let i = 0, l = attributes.length; i < l; i++) {
if (ACTIVATABLE_ATTRIBUTES.indexOf(attributes[i].name) > -1) {
for (let i = 0, l = ACTIVATABLE_ATTRIBUTES.length; i < l; i++) {
if (ele.hasAttribute(ACTIVATABLE_ATTRIBUTES[i])) {
return true;
}
}
@@ -170,7 +169,7 @@ export const isActivatable = function (ele: HTMLElement) {
};
const ACTIVATABLE_ELEMENTS = ['A', 'BUTTON'];
const ACTIVATABLE_ATTRIBUTES = ['tappable', 'button'];
const ACTIVATABLE_ATTRIBUTES = ['tappable', 'ion-button'];
const POINTER_TOLERANCE = 60;
const DISABLE_NATIVE_CLICK_AMOUNT = 2500;