Custom Endpoint with @NGRX/Data

Question

I need to modify my endpoint using @NGRX/Data. I have written a dataservice that is described in the documentation that does change the endpoint, the problem is that the data is not loaded into the store. How do I use this custom dataservice and load the data into the store once it is received?

@Injectable()
export class OfficeCustomService extends DefaultDataService<Office> {
    userId: number;
    territoryId: number;

    constructor(http: HttpClient ) {
        const url = new DefaultHttpUrlGenerator(new DefaultPluralizer([appPluralNames]));
        url.registerHttpResourceUrls({Label: {entityResourceUrl: 'office', collectionResourceUrl: 'offices'}});
        super('Office', http, url, defaultDataServiceConfig);
    }

    protected execute(method: HttpMethods, url: string, data?: any, options?: any): Observable<any> {
        const regex = /offices/gi;
        if (method === 'GET' && url.search(regex) > 0) {
            url = url + 'userId/' + this.userId + '/territoryId/' + this.territoryId;
        }
        return super.execute(method, url, data, options);
    }

    getAllByUserAndTerritory(userId: number, territoryId: number): Observable<Office[]> {
        this.userId = userId;
        this.territoryId = territoryId;
        return super.getAll();
    }

}

why doesn't the super.getAll() function load the data into the store?

score 0 · Answer 1 · answered Jan 07 '21 at 04:51

I havent' been able to figure out why the super.getAll() doesn't work but I found a work around. Instead of passing the userId and territoryId to the custom function, I'm just pulling them from the store in the dataservice. Not what I wanted to do but it does work.

@Injectable()
export class OfficeCustomService extends DefaultDataService<Office> {
    userData: User;

    constructor(
        http: HttpClient,
        store: Store ) {
        const url = new DefaultHttpUrlGenerator(new DefaultPluralizer([appPluralNames]));
        url.registerHttpResourceUrls({Label: {entityResourceUrl: 'office', collectionResourceUrl: 'offices'}});
        super('Office', http, url, defaultDataServiceConfig);
        store.select(fromState.getUser).subscribe((user: User) => {
            this.userData = user;
        });
    }

    protected execute(method: HttpMethods, url: string, data?: any, options?: any): Observable<any> {
        const regex = /offices/gi;
        if (method === 'GET' && url.search(regex) > 0) {
            url = url + 'userId/' + this.userData.id + '/territoryId/' + this.userData.territoryId;
        }
        return super.execute(method, url, data, options);
    }
}

Custom Endpoint with @NGRX/Data

1 Answers1