コンポーネントビューngClassが更新されない

現在、@ngrx状態管理パッケージを既存のAngular2アプリケーションに組み込む途中です。これまでのところすべてがうまくいっていますが、前のコンポーネントに戻り、アプリケーションストア経由で状態を維持するときに、[ngClass]ディレクティブが正しく機能しないという問題が発生しています。コンポーネントビューngClassが更新されない

私が実装しようとしている機能は、ユーザがカテゴリをクリックしたときに、そのコンポーネントのリンクが 'selectedCategory'という@ngrxストアで更新されたコンポーネントクラスのプロパティを使用して、。ユーザーが個々の製品をクリックすると、別の製品コンポーネントに移動します。次に、ユーザーが元のコンポーネントに戻ると、 'selectedCategory'が@ngrxストアに格納されているため、リンクに 'active'というクラスを再度与える必要があります。これはうまくいかず、私の[ngClass]ディレクティブがうまく動かないようです。

ここに私のコードがあります（これはすべてリファクタリングされていますので、私たちは話が奇妙に思えるかもしれません）。

カテゴリツリーコンポーネント

@Component({ 
    selector: 'category-tree', 
    templateUrl: './app/views/directives/category-tree-view.html' 
}) 

export class CategoryTree { 
    @Input() categories: Category[]; 
    @Output() categoryChange:EventEmitter<any>; 
    contentLoaded = false; 
    selectedCategory: Category; 
    categoriesLower = []; 
    APIError = []; 

    constructor(
     private _categoryService: CategoryService, 
     private _store: Store<ProductViewerStore> 
    ) { 
     this.categoryChange = new EventEmitter(); 

     _store.select('selectedCategory') 
      .subscribe((selectedCategory) => { 
       this.selectedCategory = selectedCategory; 
      }); 
    } 

    categoryClick(category) { 
     this._store.dispatch({ type: 'MAKE_CATEGORY_SELECTED', payload: category }); 
     this.getCategoriesLower(category); 
    }

そして、それはビューです：

<li *ngFor="let category of categories" class='desktop-menu'> 
    <span (click)="categoryClick(category)" [ngClass]="{'selected' : category === selectedCategory}">{{category.name}}</span> 
    <ul *ngIf="category.sub_categories" class='sub-category'> 
     <category-tree [categories]="category.sub_categories"></category-tree> 
    </ul> 
</li>

そしてselectedCategory @ngrx減速：あなたは私のコンポーネントのコードで見ることができるように

import {Category} from "../../classes/Category"; 

export const selectedCategory = (state: Category, action) => { 
    switch(action.type) { 
     case 'MAKE_CATEGORY_SELECTED': 
      return action.payload; 
     case 'RESET_SELECTED_CATEGORY': 
      return {}; 
     default: 
      return state; 
    } 
};

、 selectedCategoryコンポーネントが保存されており、サブスクリプションで正しく返されています。このObservableが返されて解決されたときに、ビューテンプレートngClassが実行されていません。誰もがここで問題を見ることができますか？

おかげ

出典

2017-05-12 devoncrazylegs

非常に興味深い問題です。あなたはプランカを作成できますか？ – CharanRoot