Ionic: Touchstart и Touchend не срабатывают на Android

Question

Я использую Ionic v3.0 и пытаюсь создать директиву, которая будет покрывать элемент наложением при его касании, и удаляю это наложение по окончании касания.До сих пор я писал это:

import {Directive, ElementRef, HostListener, Renderer2} from '@angular/core';

@Directive({
  selector: '[tappable]' // Attribute selector
})
export class TappableDirective {

  private readonly _overlay;

  constructor(private _elmRef: ElementRef, private _renderer: Renderer2) {
    this._overlay = _renderer.createElement('div');

    this._renderer.setStyle(this._overlay, 'position', 'absolute');
    this._renderer.setStyle(this._overlay, 'width', '100%');
    this._renderer.setStyle(this._overlay, 'height', '100%');
    this._renderer.setStyle(this._overlay, 'background', '#ffffff00');
    this._renderer.setStyle(this._overlay, 'left', '0');
    this._renderer.setStyle(this._overlay, 'top', '0');
    this._renderer.setStyle(this._overlay, 'display', 'block');
    this._renderer.setStyle(this._overlay, 'transition', '0.2s');

    _renderer.appendChild(_elmRef.nativeElement, this._overlay);
  }

  @HostListener('touchstart')
  tapped() {
    this._renderer.setStyle(this._overlay, 'background', '#ffffff22')
  }

  @HostListener('touchend')
  untapped() {
    this._renderer.setStyle(this._overlay, 'background', '#ffffff00')
  }

}

Это прекрасно работает, когда я запускаю свое приложение на эмуляторе iOS, но с Android это не так.Кажется, что touchstart и touchend не срабатывают, когда я взаимодействую с элементом.Я что-то здесь упустил?

Answer 1

Я понял это.Похоже, изменение непрозрачности с помощью #ffffff00 на #ffffff22 не работает в Android.Чтобы обойти это, используйте rgba(255, 255, 255, 0) на rgba(255, 255, 255, 50) или изменив opacity.