• [NgRx] NgRx Entity Adapter Configuration


    import { Course, compareCourses } from "../model/course";
    import { EntityState, createEntityAdapter } from "@ngrx/entity";
    import { createReducer, on } from "@ngrx/store";
    import { CoursesAction } from "../actions-types";
    /*
    export interface CoursesState {
      entities: { [key: number]: Course };
      ids: number[];
    }*/
    
    export interface CoursesState extends EntityState<Course> {
      /**Extend the entity here */
      allCoursesLoaded: boolean;
    }
    
    export const adapter = createEntityAdapter<Course>({
      sortComparer: compareCourses
      // selectId: course => course.id // NgRx use 'id' by default
    });
    
    export const initCoursesState = adapter.getInitialState({
      allCoursesLoaded: false
    });
    
    export const coursesReducer = createReducer(
      initCoursesState,
      on(CoursesAction.allCoursesLoaded, (state, action) =>
        adapter.addAll(action.courses, { ...state, allCoursesLoaded: true })
      )
    );
    
    export const { selectAll } = adapter.getSelectors();
    export function compareCourses(c1:Course, c2: Course) {
    
      const compare = c1.seqNo - c2.seqNo;
    
      if (compare > 0) {
        return 1;
      }
      else if ( compare < 0) {
        return -1;
      }
      else return 0;
    
    }

    'sortCompoarer' is used with adapter when you want to sort the entites based on one prop, 'ids' will be also sorted accordingly to the new entities.

  • 相关阅读:
    有关TSQL中的ROUND()的用法
    孤立用户
    微小的边缘原理
    分段统计查询的方法
    虎尾兰
    有规律字段的拆分
    对索引视图的限制
    金额转换为英文大写
    经典名言
    最大信息熵原理
  • 原文地址:https://www.cnblogs.com/Answer1215/p/11623695.html
Copyright © 2020-2023  润新知