mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
TapClick for a,button
This commit is contained in:
@@ -8,6 +8,7 @@
|
||||
|
||||
import {View, Injectable, NgFor, NgIf} from 'angular2/angular2';
|
||||
|
||||
import {TapClick} from '../button/button';
|
||||
import {Overlay} from '../overlay/overlay';
|
||||
import {Animation} from '../../animations/animation';
|
||||
import * as util from 'ionic/util';
|
||||
@@ -15,7 +16,7 @@ import * as util from 'ionic/util';
|
||||
|
||||
@View({
|
||||
template: `
|
||||
<div class="action-menu-backdrop" (click)="_cancel()"></div>
|
||||
<div class="action-menu-backdrop" (click)="_cancel()" tappable></div>
|
||||
<div class="action-menu-wrapper">
|
||||
<div class="action-menu-container">
|
||||
<div class="action-menu-group action-menu-options">
|
||||
@@ -28,7 +29,7 @@ import * as util from 'ionic/util';
|
||||
</div>
|
||||
</div>
|
||||
</div>`,
|
||||
directives: [NgFor, NgIf]
|
||||
directives: [NgFor, NgIf, TapClick]
|
||||
})
|
||||
class ActionMenuDirective {
|
||||
|
||||
|
||||
54
ionic/components/button/button.ts
Normal file
54
ionic/components/button/button.ts
Normal file
@@ -0,0 +1,54 @@
|
||||
import {Directive, ElementRef, Optional, Ancestor} from 'angular2/angular2';
|
||||
|
||||
import {IonicConfig} from '../../config/config';
|
||||
import {Gesture} from '../../gestures/gesture';
|
||||
import * as dom from '../../util/dom';
|
||||
|
||||
|
||||
@Directive({
|
||||
selector: '[tap-disabled]'
|
||||
})
|
||||
export class TapDisabled {}
|
||||
|
||||
|
||||
@Directive({
|
||||
selector: 'a,button,[tappable]'
|
||||
})
|
||||
export class TapClick {
|
||||
|
||||
constructor(
|
||||
elementRef: ElementRef,
|
||||
config: IonicConfig,
|
||||
@Optional() @Ancestor() tapDisabled: TapDisabled
|
||||
) {
|
||||
|
||||
if (config.setting('tapPolyfill') && !this.tapGesture && !tapDisabled) {
|
||||
this.tapGesture = new Gesture(elementRef.nativeElement);
|
||||
this.tapGesture.listen();
|
||||
|
||||
this.tapGesture.on('tap', (gestureEv) => {
|
||||
this.onTap(gestureEv.gesture.srcEvent);
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
onTap(ev) {
|
||||
if (ev && this.tapGesture) {
|
||||
ev.preventDefault();
|
||||
ev.stopPropagation();
|
||||
|
||||
let c = dom.pointerCoord(ev);
|
||||
|
||||
let clickEvent = document.createEvent("MouseEvents");
|
||||
clickEvent.initMouseEvent('click', true, true, window, 1, 0, 0, c.x, c.y, false, false, false, false, 0, null);
|
||||
clickEvent.isIonicTap = true;
|
||||
this.tapGesture.element.dispatchEvent(clickEvent);
|
||||
}
|
||||
}
|
||||
|
||||
onDestroy() {
|
||||
this.tapGesture && this.tapGesture.destroy();
|
||||
}
|
||||
|
||||
}
|
||||
@@ -8,7 +8,7 @@ import {
|
||||
} from 'angular2/angular2';
|
||||
|
||||
import {Ion} from '../ion';
|
||||
import {IonInputItem} from '../form/form';
|
||||
import {IonInputItem} from '../form/input';
|
||||
import {IonicConfig} from '../../config/config';
|
||||
import {IonicComponent, IonicView} from '../../config/annotations';
|
||||
import {Icon} from '../icon/icon';
|
||||
|
||||
@@ -3,7 +3,7 @@ import {Component, Directive, View, Parent, ElementRef, forwardRef} from 'angula
|
||||
import {IonicConfig} from '../../config/config';
|
||||
import * as dom from '../../util/dom';
|
||||
import {Platform} from '../../platform/platform';
|
||||
import {IonInput} from './form';
|
||||
import {IonInput} from './input';
|
||||
|
||||
|
||||
@Component({
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import {Parent, Ancestor, Optional, ElementRef, Attribute, Directive} from 'angular2/angular2';
|
||||
|
||||
import {IonInput} from './form';
|
||||
import {IonInput} from './input';
|
||||
import {IonicApp} from '../app/app';
|
||||
import {IonicConfig} from '../../config/config';
|
||||
import {Content} from '../content/content';
|
||||
|
||||
@@ -2,7 +2,7 @@ import {Directive, View, Parent, Ancestor, Optional, ElementRef, Attribute, forw
|
||||
|
||||
import {IonicDirective} from '../../config/annotations';
|
||||
import {IonicConfig} from '../../config/config';
|
||||
import {IonInput, IonInputItem} from './form';
|
||||
import {IonInput, IonInputItem} from './input';
|
||||
import {IonicApp} from '../app/app';
|
||||
import {Content} from '../content/content';
|
||||
import {ClickBlock} from '../../util/click-block';
|
||||
|
||||
@@ -93,4 +93,8 @@ export class SwipeHandle {
|
||||
return (this.viewCtrl ? this.viewCtrl.swipeBackEnabled() : false);
|
||||
}
|
||||
|
||||
onDestroy() {
|
||||
this.gesture && self.gesture.destroy();
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user