Угловое ручное обнаружение изменений для отсоединенных компонентов - PullRequest
Новая
       47

Угловое ручное обнаружение изменений для отсоединенных компонентов

0 голосов
/ 29 декабря 2018

Используя Angular Dart 5.2, я пытаюсь выяснить, как отсоединить компонент от обнаружения изменений и выполнить ручную проверку, но не удалось.Вот минимальный пример:

app_component.dart 

import 'package:angular/angular.dart';
import 'package:angular_change_detection/detached.dart';

@Component(
  selector: 'my-app',
  template: '''
    <h1>Angular change detection tests</h1>
    <detached></detached>
  ''',
  directives: [DetachedComponent],
)
class AppComponent {}

detached.dart 

import 'dart:async';
import 'dart:math' show Random;

import 'package:angular/angular.dart';

@Component(
  selector: 'detached',
  template: '''
    <span *ngFor="let i of internal">{{i}}, </span>
  ''',
  directives: [coreDirectives],
  changeDetection: ChangeDetectionStrategy.Detached
)
class DetachedComponent implements OnInit {
  final Random random = Random();
  final ChangeDetectorRef changeDetectorRef;

  List<int> internal = [];

  DetachedComponent(this.changeDetectorRef);

  @override
  void ngOnInit() {
    Timer.periodic(Duration(seconds: 1), (_) {
      internal = List.generate(random.nextInt(10) + 1, (i) => (DateTime.now().millisecondsSinceEpoch * (i + 1)) % 1337);
      print("Internal list changed: $internal}");
    });

    Timer.periodic(Duration(seconds: 3), (_) {
      changeDetectorRef.detectChanges();
      print("detecting changes; internal list reference: ${internal.hashCode}");
    });

  }
}

Мои ожиданиябыло то, что представление отсоединенного компонента будет обновляться каждые 3 секунды со свежими значениями internal.Журнал консоли показывает, что internal Список создается заново каждую секунду с новыми значениями, и я запускаю detectChanges() каждые 3 секунды, но на экране ничего не меняется.

Вещи, которые я также пробовал:

  • ручное отсоединение компонента от обнаружения изменений от конструктора - ничего не изменилось
  • с использованием стратегии OnPush и markforCheck() вместо detectChanges() - сработало как ожидалось

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

Ответы [ 2 ]

0 голосов
/ 14 января 2019

Вам необходимо прикрепить перед запуском обнаружение изменений

  • повторно присоединить
  • markForCheck()
  • отсоединить
0 голосов
/ 13 января 2019

с использованием стратегии OnPush и markforCheck()

Это наиболее распространенный способ запуска обнаружения изменений вручную

...