Trying to use angular2-in-memory-web-api

I’m trying to include Angular’s “in-memory-api” in my ionic 2 project. The project directory was created using ionic start cutePuppyPics --v2

Running: npm install angular2-in-memory-web-api --save produces the following warnings:

├── UNMET PEER DEPENDENCY @angular/core@2.0.0-rc.4
├── UNMET PEER DEPENDENCY @angular/http@2.0.0-rc.4
└── angular2-in-memory-web-api@0.0.17 

npm WARN tslint@3.10.2 requires a peer of typescript@>=1.7.3 but none was installed.
npm WARN angular2-in-memory-web-api@0.0.17 requires a peer of @angular/core@2.0.0-rc.5 but none was installed.
npm WARN angular2-in-memory-web-api@0.0.17 requires a peer of @angular/http@2.0.0-rc.5 but none was installed.

Importing Symbols from the lib in app.ts like this:
import { InMemoryBackendService, SEED_DATA } from '/angular2-in-memory-web-api';

And then running ionic serve produces the following errors:
ionic $ Error: Cannot find module '/angular2-in-memory-web-api' from '/Users/...

How should I include the library in my project?

I managed to fix my issue by installing angular-2-in-memory-web-api version 0.0.14 which is compatible with the version of angular used in my ionic 2 project (2.0.0-rc.4)

And then in app.ts i include the following:

import { XHRBackend, HTTP_PROVIDERS } from '@angular/http';
import { InMemoryBackendService, SEED_DATA } from 'angular2-in-memory-web-api';

@Component({
  providers: [
    HTTP_PROVIDERS,
    { provide: XHRBackend, useClass: InMemoryBackendService }, // in-mem server
    { provide: SEED_DATA,  useClass: YOUR_DATA }               // in-mem server data
  ]
})
export class MyApp {
....
1 Like