angular-cli: InMemoryWebApiModule does not work.

npm install --save angular2-in-memory-web-api then do like the tutorial

step 1 add in-memory-data.service.ts //in-memory-data.service.ts

import {InMemoryDbService} from "angular2-in-memory-web-api/index";
export class InMemoryDataService implements InMemoryDbService {
  createDb() {
    let heroes = [
      {id: 11, name: 'Mr. Nice'},
      {id: 12, name: 'Narco'},
      {id: 13, name: 'Bombasto'},
      {id: 14, name: 'Celeritas'},
      {id: 15, name: 'Magneta'},
      {id: 16, name: 'RubberMan'},
      {id: 17, name: 'Dynama'},
      {id: 18, name: 'Dr IQ'},
      {id: 19, name: 'Magma'},
      {id: 20, name: 'Tornado'}
    ];
    return {heroes};
  }
}

step2 update AppModule //app.module.ts

import {BrowserModule, Title} from "@angular/platform-browser";
import {NgModule} from "@angular/core";
import {FormsModule} from "@angular/forms";
import {HttpModule} from "@angular/http";
import {AppComponent} from "./app.component";
import {AppRoutingModule} from "./app-routing.module";
import {PageNotFoundComponent} from "./common/page-not-found/page-not-found.component";
import {InMemoryWebApiModule} from "angular2-in-memory-web-api/index";
import {InMemoryDataService} from "./memory-data/in-memory-data.service";

@NgModule({
  declarations: [
    AppComponent,
    PageNotFoundComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    InMemoryWebApiModule.forRoot(InMemoryDataService),
    AppRoutingModule
  ],
  providers: [
    Title
  ],
  bootstrap: [AppComponent]
})
export class AppModule { }

After done the steps above,I just run start script in package.json(ng serve) Output an error:

ERROR in Error encountered resolving symbol values statically. Calling function ‘InMemoryWebApiModule’, function calls are not supported. Consider replacing the function or lambda with a reference to an exported function, resolving symbol AppModule in D:/angular2/cli-demo/src/app/app.module.ts, resolving symbol AppModule in D:/angular2/cli-demo/src/app/app.module.ts

What’s wrong?How could I make it works?

About this issue

Original URL
State: closed
Created 7 years ago
Reactions: 3
Comments: 20 (1 by maintainers)

Most upvoted comments

Faced version compatibility issues:

npm install angular-in-memory-web-api --save
npm WARN angular-in-memory-web-api@0.6.0 requires a peer of @angular/common@^6.0.0-rc.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-in-memory-web-api@0.6.0 requires a peer of @angular/core@^6.0.0-rc.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-in-memory-web-api@0.6.0 requires a peer of @angular/http@^6.0.0-rc.0 but none is installed. You must install peer dependencies yourself.
npm WARN angular-in-memory-web-api@0.6.0 requires a peer of rxjs@^6.0.0-beta.1 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.3 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})

+ angular-in-memory-web-api@0.6.0
added 1 package in 6.927s

According to changelog: https://github.com/angular/in-memory-web-api/blob/master/CHANGELOG.md Version 0.6.0 has breaking changes and is probably only compatible with Angular 6 (not LTS yet).

Made it work by downgrading to angular-in-memory-web-api@0.5.4.

npm install angular-in-memory-web-api@0.5.4 --save

+38

SMAK1993 on Mar 24, 2018

encountered the same problem, with angular-in-memory-web-api: 0.5.3 @angular/cli 1.6.7

ddwolf on Feb 2, 2018

Like to reopen this if possible. Running into the same issue, even after npm install --save angular-in-memory-web-api

According to the third comment on this answer SO, I need to update my angular-cli-build.js file, though I do not have one on my system. I also do not have a system-config file generated by the cli. Only a .tsconfig.json & angular-cli.json.

Any direction on how to move forward?

Versions, etc

@angular/cli: 1.0.0-beta.32.3
node: 6.10.0
os: darwin x64
@angular/common: 2.4.8
@angular/compiler: 2.4.8
@angular/core: 2.4.8
@angular/forms: 2.4.8
@angular/http: 2.4.8
@angular/platform-browser: 2.4.8
@angular/platform-browser-dynamic: 2.4.8
@angular/router: 3.4.8
@angular/cli: 1.0.0-beta.32.3
@angular/compiler-cli: 2.4.8

thoughtpalette on Mar 3, 2017

Heya, you seem to be using an old version of https://github.com/angular/in-memory-web-api.

Install npm install --save angular-in-memory-web-api instead (without the 2), that version should be ok. The old version wasn’t statically analyzable which caused problems with AoT.

filipesilva on Jan 23, 2017

Thanks all.I have tried all options stated here and other places but still found the in-memory-web-api was not saved in my src folder.why

ibnthani2016 on Mar 27, 2018

If you are using "@angular/core": "^7.0.0", you can update angular-in-memory-web-api to version 7 in your package.json : "angular-in-memory-web-api": "^0.7.0",

fabki00 on Jan 16, 2019

honestly I think providing new users with a minimal backend in various states of completion might be favorable.

DwordPtr on Feb 27, 2018