Убрать / опустить нажатие / убавление / задержку сенсорного запуска в Angular 8?

Question

Я разрабатываю приложение с использованием Angular 8 (angular.io) и замечаю, что события press / mousedown / touchstart имеют задержку перед тем, как они будут запущены, или, по крайней мере, до того, как какой-либо ответ будет виден в представлении.Есть ли способ уменьшить эту задержку или убрать ее?Это происходит как на моем ноутбуке, так и на сенсорной панели, поэтому я знаю, что это не зависит от устройства.

Answer 1

Используете ли вы стратегию обнаружения изменений OnPush для своего компонента?

Если да, то я ожидаю, что ваши данные изменяются асинхронно.Это означает, что обнаружение изменений не запускается, когда ваши данные готовы - следовательно, приложение не перерисовывает компонент.Даже если ваши данные действительно изменены, вы не увидите изменений на своем экране до того, как сработает обнаружение следующего изменения.

В этом случае у вас есть несколько вариантов:

1) Использовать Observable (Subject, BehaviorSubject или простой Observable) с async каналом в вашем HTML вместо используемых вами данных.

app.component.ts:

import { BehaviorSubject } from "rxjs";

class AppComponent {
  counter$ = new BehaviorSubject(0);

  onClick(): void {
    setTimeout(() => {
      this.counter$.next(this.counter$.getValue() += 1);
    });
  }
}

app.component.html

<div>You clicked {{ counter$ | async }} times</div>

2) Вставьте ChangeDetectorRef в конструктор вашего компонента и инициируйте обнаружение изменений вручную.

app.component.ts:

import { ChangeDetectorRef } from "@angular/core";

class AppComponent {
  counter = 0;

  constructor(private cdr: ChangeDetectorRef) {
  }

  onClick(): void {
    setTimeout(() => {
      this.counter += 1;
      this.cdr.detectChanges();
    });
  }
}

Здесь вы можете найти объяснение ChangeDetectionStrategy.OnPush: https://blog.angular -university.io / onpush-изменения-обнаружения-как это работает /