Angular 2 Routing Error with ModuleWithProviders

Question

enter image description here

I'm new in Angular 2 I need help on the routing part. I'm using http://jasonwatmore.com/post/2016/09/29/angular-2-user-registration-and-login-example-tutorial

I got an error

Exported variable 'routing' has or is using name 'ModuleWithProviders' from external module "/home/frank/angular/node_modules/@angular/core/src/metadata/ng_module" but cannot be named.

Here is my code

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule }    from '@angular/forms';
import { HttpModule } from '@angular/http';

// used to create fake backend
import { fakeBackendProvider } from './_helpers/index';
import { MockBackend, MockConnection } from '@angular/http/testing';
import { BaseRequestOptions } from '@angular/http';

import { AppComponent }  from './app.component';
import { routing }        from './app.routing';

import { AlertComponent } from './_directives/index';
import { AuthGuard } from './_guards/index';
import { AlertService, AuthenticationService, UserService } from './_services/index';
import { HomeComponent } from './home/index';
import { LoginComponent } from './login/index';
import { RegisterComponent } from './register/index';

@NgModule({
    imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    routing
 ],
declarations: [
AppComponent,
AlertComponent,
HomeComponent,
LoginComponent,
RegisterComponent
],
providers: [
    AuthGuard,
    AlertService,
    AuthenticationService,
    UserService,

    // providers used to create fake backend
    fakeBackendProvider,
    MockBackend,
    BaseRequestOptions
],
bootstrap: [AppComponent]
})

 export class AppModule { }

Any ideas on the error? I also tried seimport { ModuleWithProviders } from '@angular/core';tting my "declaration": true, in tsconfig.js and also imported

Can you show the `app.routing` file. Looks like that's where the error is coming from — Paul Samsotha, Dec 14 '16 at 03:38

score 10 · Accepted Answer · answered Dec 16 '16 at 07:00

10

I solved this by doing:

export const routing: ModuleWithProviders = RouterModule.forRoot(APP_ROUTES);

And don't forgot to import ModuleWithProviders from @angular/core

import { ModuleWithProviders } from "@angular/core";

answered Dec 16 '16 at 07:00

Mingchao Liao

221
1
4

score 3 · Answer 2 · answered Dec 15 '16 at 03:34

You should not need to import ModuleWithProviders. I think that you only needed to import that module in older Release Candiades (RCs). Currently, importing MgModule will automatically allow providers which seems to be the only purpose for ModuleWithProviders DOCS

Angular 2 Routing Error with ModuleWithProviders

2 Answers2

Linked