The Angular 2 final release and the documentations "The Tour of Heroes" - angularjs

Question

Last 2 days I've been looking at the Angular 2, I'm new to it so I went straight "the official documentation" which is the Tour of Heroes example, it's ok "Just ok" tutorial and I followed the steps and I could understand a lot from it, when I reached the HTTP part and how to get access to Data sources issues started to pop up, I'm not sure if it's me very beginner in this OR the documentation is not up-to-date with the final release, :/ Google people, a big company and you guys can not assign this task to a team who take care of the documentation and keeps it updated with the releases? My opinion it's such task is mandatory for some reasons and it's the company responsibility or the Angular 2 project team's responsibility, it's new release and it's completely different from the angularjs 1.x so don't you guys think that you should provide solid reliable support in the form of up-to-date documentation right? Unless you want React to be in the lead ;)
If anyone knows good documentation for http and how to retrieve modify save and delete data and it's compatible with the final release please share it, now the issue that I collided with in the Tour of Heroes tutorial is that I get error because of this line:
import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
can't find the module 'angular2-in-memory-web-api'
I was ok I'm not gonna use this in memory web Api, so I created asp.net web Api and it works fine and here is the GetHeroes method in the Heroes Controller it's so straight forward:
// GET: api/Heroes
public IQueryable<Hero> GetHeroes()
{
return db.Heroes;
}
of course I test the method and it returns all the heroes so the api working just fine, now this's the method from the hero.service.ts :
getheroes(): Promise<Hero[]>
{
return this.http.get(this.heroesUrl)
.toPromise()
.then(response => response.json().data as Hero[])
}
ok I get no errors but data is nt showing like literally nothing however when I remeove .data as Hero[] part I get enter image description here
and once I click on "one hero" I get nothing as well and the url like this : 4200/details/undefined notice instead of the hero Id I get undefined ?! anyway I noticed that in many videos of some people "tutoring" angular 2 that there is no common steps to work Http for accessing data and doing CRUD operation through api , every one doing it in different way and the thing is when I try to follow it's just not working with what I have and this's from my package.json:
"dependencies": {
"#angular/common": "2.0.0",
"#angular/compiler": "2.0.0",
"#angular/core": "2.0.0",
"#angular/forms": "2.0.0",
"#angular/http": "2.0.0",
"#angular/platform-browser": "2.0.0",
"#angular/platform-browser-dynamic": "2.0.0",
"#angular/router": "3.0.0",
"core-js": "^2.4.1",
"rxjs": "5.0.0-beta.12",
"ts-helpers": "^1.1.1",
"zone.js": "^0.6.23"
},
"devDependencies": {
"#types/jasmine": "^2.2.30",
"angular-cli": "1.0.0-beta.15",
"codelyzer": "~0.0.26",
"jasmine-core": "2.4.1",
"jasmine-spec-reporter": "2.5.0",
"karma": "1.2.0",
"karma-chrome-launcher": "^2.0.0",
"karma-cli": "^1.0.1",
"karma-jasmine": "^1.0.2",
"karma-remap-istanbul": "^0.2.1",
"protractor": "4.0.5",
"ts-node": "1.2.1",
"tslint": "3.13.0",
"typescript": "2.0.2"
}
So anyone can help or share something official and compatible with the final release? I wish the Google people pay attention and take care of the documentations, not everyone is an expert.

Answer 1

You must to fix the line:
import { InMemoryWebApiModule } from 'angular-in-memory-web-api';
To:
import { InMemoryWebApiModule } from 'angular2-in-memory-web-api';
You missed the 2 ...
Also in in-memory-data.service.ts file fix it
There is a mistake in documentation