ionic2 appuyez contre cliquez

Je commence avec angular2 et ionic2;

Dans ionic2, j'ai un bouton qui va appeler une méthode de mon composant. Comme ceci:

<button secondary clear large>
</button>

Dois-je utiliser (click) - angular2 OU (tap) - ionic2?

Comme ceci:

(click)

<button secondary clear large (click)="pause()">
</button>

(tap)

<button secondary clear large (tap)="pause()">
</button>

Il y a une différence? Vous pouvez voir sur (tap) dans
http://ionicframework.com/docs/v2/components/#gestures

Thx.

source d'informationauteur José Barbosa

  1. 41

    Si faire des applications mobiles, (tap) peut-être mieux. C'est parce que lors de l'utilisation de (click) l'action s'exécute toujours, même lorsque vous appuyez accidentellement. Le (tap) ne sera pas exécuté si l'utilisateur détient pour une plus longue période. Et si vous voulez avoir un bouton qui doit être cliqué pour une plus longue période de temps, vous pouvez utiliser le (press).

    Noter que dans certains ionique versions de la (click) événement ne sera pas exécuté sur iOS. Par conséquent l'utilisation de (tap) serait la solution recommandée.

  2. 9

    Je pense que cela dépend vraiment de la façon "native" vous voulez l'expérience de l'utilisateur.

    La (tap) événement provient de la Hammer.js bibliothèque. Si vous regardez le lien, vous verrez les exigences qui doivent être remplies pour que le appuyez sur un événement pour le feu.

    Le premier critère à prendre en compte est la temps option avec une valeur par défaut de 250ms. Cela signifie que si une de la presse est de plus de 250 ms alors que l'événement ne se déclenche pas.

    La seconde condition pour être conscient, c'est le seuil option avec une valeur par défaut de 2 (pas sûr de ce que l'unité de ce qui est, éventuellement pixels). Cela signifie que si la presse a un mouvement de plus de 2 cas ne se déclenche pas. E. g. en déplaçant votre doigt de gauche à droite direction au-dessus de l'écran, puis en appuyant sur l'élément au cours de ce mouvement, l'événement peut ne pas se déclencher en fonction de la vitesse du mouvement.

    Cependant

    La (click) événement sera encore le feu dans les deux cas, je viens de le souligner prévoyant que lorsque la presse est publiée, il est toujours à l'intérieur de l'élément cible.

    Au début la raison que j'ai dit "ça dépend vraiment de la" repose sur la façon dont d'autres applications poignée de ces scénarios (chaque application pourrait potentiellement différents et il peut également différer selon le résultat du cas d'utilisation).

    Autant que je suis conscient des boutons sur les applications Android, j'ai vérifié (ceux avec un résultat visuel par exemple, de navigation ou de messages popup) fonctionnent de la même manière que le (click) événement fourni par Angulaire.

    Je ne peux pas commenter sur la façon dont les applications IOS de travail en utilisant les mêmes principes que je n'ai pas testé.

    Je ne suis pas ce qui implique que, dans tous les cas d'utilisation (click) doit être utilisé au lieu de (tap) mais essayez de prendre en considération la façon dont d'autres applications natives de se comporter et de décider à partir de là qui est le plus approprié.

  3. 3

    Je voudrais ajouter que vous pouvez utiliser (tap) de l'événement pour les éléments comme button, amais pour les non-bouton d'éléments de l'attribut tappable est utile:

    Si vous voulez instantanée clique sur non-bouton d'éléments que vous aurez à ajouter tappable directive à cet élément, sinon, il dispose d'un délai de 300ms. Par exemple:

    <div tappable (click)="someHandler()">Click me</div>
  4. 1

    J'ai eu des problèmes avec (click) dans iOS, mais sur Android, il a travaillé sur ok. Dans iOS quand j'ai changé la langue de l'application et juste après cliqué sur le lien il n'a rien fait. Je pense que c'est lié à Ionique cliquez sur bloqueur de https://github.com/driftyco/ionic/issues/6996.

    Mais après j'ai changé (click) à (tap) après le changement de langue lien fonctionne instantanément. J'ai eu aussi des problèmes lors de la sélection de la langue n'a rien (même après avoir attendu un certain temps) et changé aussi de (click) à (tap) et il fonctionne maintenant parfaitement.

  5. 1

    En plus vers le haut voté question que je voudrais souligner que (tap) processus $event différemment lorsqu'il est utilisé en tant que paramètre.
    Si je me souviens bien, lors de l'utilisation de (tap) la target attribut dans $event sera l'élément que vous avez fait tapé sur, pas l'élément qui a le (tap) cas de liaison.
    Ce serait pertinente si vous avez des éléments d'enfant à l'intérieur de votre élément avec (tap) lié à elle.

  6. -1

    iOS a des problèmes avec cliquez sur l'événement en général (de l'événement sur le web, si vous testez en responsive appareil mobile dans le navigateur de la console).

    Donc ce qu'il se passe utilisateur, cliquez deux fois pour effectuer des actions.

    J'ai trouvé cela parce que si vous faites du développement mobile (chrome console ou même iOS Émulateur), vous devrez utiliser (tap) au lieu de l'événement.

    Le problème était difficile de savoir à cause de son comportement anormal, lorsque vous utilisez (clic),

    quelque chose qui est généralement non-cliquable, ce problème se produit.

    Donc si vous l'utilisez (tap) sur ces éléments et (clic), tout devrait fonctionner correctement.

    Ma suggestion est d'utiliser à la fois pour le mieux!