Угловой 7: ChangeDetectorRef detectChanges () вызывает бесконечный цикл при вызове изнутри подписки - PullRequest
0 голосов
/ 25 ноября 2018

Я публикую здесь после прочтения всех материалов, связанных с обнаружением изменений и аналогичной публикацией, и не могу решить мою проблему.

ChangeDetectorRef detectChanges() вызывает бесконечный цикл при вызове изнутри подписки.Если я не позвоню detectChanges, я получу ошибку ExpressionChangedAfterCheck.Я серьезно не знаю, как решить, и почему возникает ошибка ExpressionChangedAfterCheck

ngAfterViewInit() {
    this.route.params.subscribe((params) => {
      this.userId = params.userId;
      if (this.userId != undefined) {
        this.loadActivity();
      }
      else {
        alert("Userid not supplied");
      }
      this.cdRef.detectChanges();
    });
  }

  loadActivity() {
    while(this.layers.length > 0){
      this.layers.pop();
    }
    this.loading = true;
    this.userService.authenticatedGet(ApiUrls.GetLocation(this.userId, this.activity.from.getTime(), this.activity.to.getTime()), {}).subscribe(
      (res:any) => {
        this.user = res.user;
        this.loading = false;
        // other logic
        this.cdRef.detectChanges();
        console.log("Loading is " + this.loading);
      }
    );
  }

Примечание. Эта проблема возникает только тогда, когда значение связано с ngIf.

1 Ответ

0 голосов
/ 26 ноября 2018

Я решил это.Проблема была не в жизненном цикле, а в директиве leaflet из проекта ngx-leaflet.

Когда я удалил директиву и привязки, связанные с листовкой, все ошибки исчезли.

Ошибкапришел даже с этим:

<ng-container *ngIf="!loading">
    <div
      class="map"
      leaflet
      (leafletMapReady)="onMapReady($event)"
      [leafletOptions]="options"
      [leafletLayers]="layers"
      [leafletLayersControl]="layersControl">
    </div>
</ng-container>

Я попытался альтернативно добавить Detechanges и MarkForCheck, но опять не повезло.

  onMapReady(map: Map) {
    this.map = map;
    setTimeout(() => map.invalidateSize(), 1000);
    this.route.params.subscribe(params => {
      this.userId = params["userId"];
      this.loadActivity();
    });
    this.cdRef.markForCheck();
  }

Наконец, во время написания этого ответа я бросил листовку, иЯ собираюсь попробовать Angular-Google-Maps.

И да, AGM работает нормально.

...