Anyone try using InMemoryWebAPI with standalone components?

I am using Angular v16 with standalone components. I implemented InMemoryWebAPI as I have in NgModule-based projects, but it doesn't seem to be working. I keep getting 404 not found.

Anyone try this and have success with InMemoryWebAPI with standalone bootstrapping? Anything else different I need to do to get it to work with standalone components?

Here is my app.config.ts

export const appConfig: ApplicationConfig = {
  providers: [
    importProvidersFrom(InMemoryWebApiModule.forRoot(AppData, { delay: 1000 })),
    provideHttpClient(),
    provideRouter(routes, withComponentInputBinding())
  ]
};

Here is my AppData

export class AppData implements InMemoryDbService {

  createDb(): { products: Product[] } {
    const products = ProductData.products;
    console.log(products);
    return { products };
  }

}

And here is my service:

  private sub = this.#http.get<Product[]>('api/products')

Thanks for any ideas or debugging tips.

EDIT: I have a stackblitz here: https://stackblitz.com/edit/github-crud-signals-djk

The service currently has the http calls commented out because they were generating 404 errors. It instead hard-codes the data.

With assistance from the Angular team, I was able to resolve the issue. If you run into this, the solution was to adjust the order of the imports in the bootstrapping. They should look like this:

export const appConfig: ApplicationConfig = {
  providers: [
    provideHttpClient(),
    importProvidersFrom(InMemoryWebApiModule.forRoot(AppData, { delay: 1000 })),
    provideRouter(routes, withComponentInputBinding())
  ]
};

Notice that the HttpClient() is imported before InMemoryWebApiModule.