NGRX/data entity getAll concats old data with new instead of updating

Question

I am trying to use ngrx-data-lab as an example for my project.

Here's is the stackblitz of project I used.

I can't use the actual url of the server that I am using. The url belongs to my company. But what is happening is that the server is returning the randomly generated data to the application. The problem is that the entities in store don't get replaced but instead they are added up. Every time I refresh the heroes page the server brings new data and concatenates it with the old data.

In entity-store.module.ts I changed defaultDataServiceConfig root and Hero urls to my server. getAll() works, but as I said again it concats the data to old one.

  root: 'api', // default root path to the server's web api

  // Optionally specify resource URLS for HTTP calls
  entityHttpResourceUrls: {
    // Case matters. Match the case of the entity name.
    Hero: {
      // You must specify the root as part of the resource URL.
      entityResourceUrl: 'api/hero/',
      collectionResourceUrl: 'api/heroes/'
    }
  },

How do I make the getAll replace the old data istead of concat-ing it?

Vato Vato · Accepted Answer · 2019-10-25T08:02:17

My bad. After recreating my project several times. I found that getAll will always merge the local and remote entities. to replace the entities you have to use load.

getAll

  /**
   * Dispatch action to query remote storage for all entities and
   * merge the queried entities into the cached collection.
   * @param [options] options that influence merge behavior
   * @returns Observable of the collection
   * after server reports successful query or the query error.
   * @see load()
   */
  getAll(options?: EntityActionOptions): Observable<T[]> {
    return this.dispatcher.getAll(options);
  }

Load

  /**
   * Dispatch action to query remote storage for all entities and
   * completely replace the cached collection with the queried entities.
   * @param [options] options that influence load behavior
   * @returns Observable of the collection
   * after server reports successful query or the query error.
   * @see getAll
   */
  load(options?: EntityActionOptions): Observable<T[]> {
    return this.dispatcher.load(options);
  }

NGRX/data entity getAll concats old data with new instead of updating

1 Answers