angularangular-in-memory-web-api

How to configure in-memory-web-api in Angular to accommodate route parameters

I am trying to get my data service to accommodate route parameters.

  @Injectable({
    providedIn: 'root'
  })
  export class DataService implements InMemoryDbService {
  
  createDb(): {
    products: IProducts[],
    product: IProduct
  } {
    const products = ProductsData.products;
    const product = ProductsData.product;

    return { products, product };
  }
}

When I'm executing a route like products/123 I want the system to get the product collection. I've tried different approaches using the environment file and the product collection within the products-data.ts file, but I'm not having any luck. Are there examples available? For that matter, how should the data service be configured to accommodate query strings?

Solution

  • The property of the object you want to filter will be the key of the query string.

    api/heroes/?name=${term}

    Here we filter name of the object { id: 0, name: 'Zero' }.

    Just search for "tour of heroes stackblitz" to get wide range of examples for you to use as reference.

    Forked Stackblitz