Mention import ordering in documentation

[psamsotha]

Maybe this is basic Angular stuff we should know, but I think it would still be beneficial to add it to the docs. I was banging my head for a day and half trying to figure out why the in-memory backend wasn't being used.

My initial configuration was like

@NgModule({
  imports: [
    InMemoryWebApiModule.forRoot(...),
    CoreModule.forRoot(),    // imports HttpModule
    // Material 2
    MdIconModule.forRoot(),  // also imports HttpModule -> I DIDN'T KNOW!!
})
class AppModule {}

It seems this ordering will cause the last added HttpModule (with the default XHRBackend) to be used instead of the InMemoryBackendService. Changing the order to have the InMemoryWebApiModule last did the trick.

I think it should be mentioned in the docs that we should make sure to place the module last, just in case.

[wardbell]

It should not matter. What is MdIconModule doing? Can you create a tiny repro of the failure? You could start with an existing HTTP Plunker from the documentation and morph it into a failing example.

[psamsotha]

Sure. Here you go. Just click the button. You can't really see anything updated in the view (in the error case - which is the initial setup). You need to check the network tab. There you will an XHR request with a 404 status. If switch around the module imports from

InMemoryWebApiModule.forRoot(HeroData),
HttpModule

to

HttpModule,
InMemoryWebApiModule.forRoot(HeroData)

you should see that everything works fine, no XHR request, and mock data in view

[wardbell]

You are correct! And I updated the Http chapter in the angular.io documentation accordingly and also in this README.md. Thanks!