angular - 从秋田商店查询时，Angular 10 未检测到更改

Question

我很可能错误地设置了我的秋田商店，但我非常密切地关注了文档。

我正在设置一些routerLinks 以从商店动态填充（应用程序行为取决于用户导航时更新路线）

在返回应用程序状态的订阅中，我从中派生新路由，如果我将返回的对象分配给我的组件参数，我会感到害怕ExpressionChangedAfterItHasBeenCheckedError

奇怪的是，如果我改为在订阅中为该属性分配一个静态对象，我不会收到错误消息（但值是静态的，不是我需要的）

我能够使用它，.detectChanges()但我的印象是 Akita 为我们处理更改检测，所以我非常困惑（并且不想每次我子到商店查询时都必须手动检测更改）

有效的代码（在导航栏中）：

  ngOnInit(): void {
    this.getRouteParams();
    this.appQuery.appState$.subscribe(next => {
      this.app = next;
      this.change.detectChanges(); 
      //setting this.app = a static object instead of the prior 2 lines also works "fine"
    });

设置状态的代码（在可导航组件之一中）：

  ngOnInit(): void {  
    this.route.params.subscribe(
      (params: Params) => {
        this.slug = params['slug'] ? params['slug'] : '';
        this.appService.updateTab('activeRosterSlug',this.slug);
      }
    )
  }

查询.ts：

import { Injectable } from '@angular/core';
import { Query } from "@datorama/akita";
import { AppState, AppStore } from './store'

@Injectable({providedIn: 'root'})
export class AppQuery extends Query<AppState> {
  constructor(private appStore: AppStore){
    super(appStore)
  }
  appState$ = this.select();
}
  }

商店.ts：

import { Injectable } from '@angular/core';
import { Store, StoreConfig } from '@datorama/akita';

export type AppState = {
  activeRosterSlug: string, 
  activeMatchSlug: string;
  activeEventSlug: string;
  activeManifestSlug: string;
  maximixed: boolean;
  footerExp: boolean;
}

export const getInitialState = () => {
  return{
    activeRosterSlug: '',
    activeMatchSlug: '',
    activeEventSlug: '',
    activeManifestSlug: '',
    maximixed: false,
    footerExp: false
  }
}

@Injectable({providedIn: 'root'})
@StoreConfig({name: 'appStore'})
export class AppStore extends Store<AppState> {
  constructor(){
    super(getInitialState())
  }
}

服务.ts：

import { Injectable } from '@angular/core';
import { AppStore } from './store';

@Injectable({providedIn: 'root'})
export class AppService {
  constructor(private appStore: AppStore) {}

  updateTab(tabName: string, tabId) {
    let update = {}
    update[tabName] = tabId;
    this.appStore.update(update);
  } 
}

标签： angulartypescriptangular-akita