NGRX 實體：如何在模板中使用它？

Question

我遵循了有關如何使用 NGRX 實體實現 NGRX 存儲的教程。

一切似乎都有效（據我所知，使用 dev-tools-extension）。 但是，我不知道我應該/可以如何迭代模板中的結果。

模板：

<h3>MOVIES</h3>

  <ng-container *ngIf="movies$">
      <table>
        <tbody>
        <tr *ngFor="let movie of (movies$ | async); let i = index">
          <li>
            {{movie?.title}}
          </li>
        </tr>
        </tbody>
      </table>
  </ng-container>

組件：

@Component({
  selector: 'app-movies',
  templateUrl: './movies.component.html',
  styleUrls: ['./movies.component.scss']
})
export class MoviesComponent implements OnInit {

  movies$: Observable<Dictionary<Movie>>;

  constructor(private store: Store<MovieState>) {
    this.store.dispatch(loadMovies());
    this.movies$ = this.store.pipe(select(selectMovieEntities))
  }

  ngOnInit(): void {
  }

}

為了完整起見，reducer：

const {
  selectIds,
  selectEntities,
  selectAll,
  selectTotal
} = fromReducer.adapter.getSelectors();

export const getMovieState = createFeatureSelector<fromReducer.State>(fromReducer.moviesFeatureKey);

export const selectMovieEntities = createSelector(getMovieState, selectEntities);

錯誤消息：

我想知道我是否應該首先“映射”結果集或者這里的最佳實踐是什么。

希望得到您的幫助！

Answer 1

selectEntities將實體狀態作為字典返回（id 是鍵）。 如果您只想要實體（作為數組），請使用selectAll選擇器。

export const selectMovieEntities = createSelector(getMovieState, selectAll);