I encountered an error stating "Can't resolve all parameters for RouteParams" while setting up a basic app for routing.
Here is how my app.module.ts file is structured:
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { App } from './app';
import { routing } from './components/appRouting/app.routing';
import { LoginComponent } from './components/login/loginComponent';
import {SliderMenuComponent} from './components/sliderMenu/sliderMenuComponent';
@NgModule({
imports: [
BrowserModule,
FormsModule,
routing,
HttpModule
],
declarations: [App,LoginComponent,SliderMenuComponent],
providers: [],
bootstrap: [App]
})
export class AppModule { }
This is the content of my app.routing.ts file:
import { ModuleWithProviders } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {LoginComponent} from '../login/loginComponent';
import {SliderMenuComponent} from '../sliderMenu/sliderMenuComponent';
const appRoutes: Routes = [
{
path: '',
redirectTo: '/login',
pathMatch: 'full'
},
{ path: 'login', component: LoginComponent },
{ path: 'slider', component: SliderMenuComponent }
];
export const appRoutingProviders: any[] = [
];
export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);
As for my app.ts file, here is what it contains:
import {Component} from '@angular/core';
@Component({
selector: 'app',
template : `
<h1 class="title">Component Router</h1>
<nav>
<a routerLink="/slider" routerLinkActive="active">Slider</a>
<a routerLink="/login" routerLinkActive="active">Login</a>
</nav>
<router-outlet></router-outlet>
`
})
export class App {
}