After smoothly running my Angular2 RC5 application, I decided to upgrade to RC6. However, upon doing so, my application ceased functioning and displayed the following error message:
Error: Can't resolve all parameters for LoginComponent: (?, ?).
My Angular2 setup is fairly standard. Below is the code snippet for the LoginComponent
, with each injected parameter in the constructor being annotated with @Injectable()
.
import {AuthService} from "../../auth/auth-service";
import {ActivatedRoute, Router} from "@angular/router";
import {Component, Inject, OnInit} from '@angular/core';
@Component({
selector: 'login-component',
templateUrl: 'login/login.html',
styleUrls: ['login/login.css']
})
export class LoginComponent {
private model = {login: '', password: ''};
constructor(private authService: AuthService, private router: Router) {
}
protected doLogin(event: Event) {
this.authService.login(this.model.login, this.model.password).then(() => {
this.router.navigate(['/landing']);
});
}
}
Below is the app-module
:
import {NgModule} from '@angular/core';
import {HttpModule} from '@angular/http';
import {BrowserModule} from '@angular/platform-browser';
import {FormsModule} from '@angular/forms';
import {AppService} from './app-service'
import {AuthService} from "./auth/auth-service";
import {RouterModule} from '@angular/router';
import {AppComponent} from "./component/app-component";
import {ChessComponent} from './component/chess/chess-component';
import {LoginComponent} from "./component/login/login-component";
import {LandingComponent} from "./component/landing/landing-component";
import {AuthGuardService} from "./auth/auth-guard-service";
import {GuidService} from "./shared/guid-service";
import {EchoService} from "./io/echo-service";
import {PermissionsService} from "./permissions-service";
import {
EnumerateSetValuesPipe, EnumerateMapPipe, EnumerateMapKeysPipe, EnumerateMapValuesPipe,
EnumerateObjectPipe, EnumerateObjectKeysPipe, EnumerateObjectValuesPipe,
NeighbouringValuesPipe
} from "./shared/pipes";
import { TinyComponent } from "./component/tiny/tiny";
import {HtmlService} from "./component/docs/html-service";
import {DocsComponent} from "./component/docs/docs-component";
@NgModule({
imports: [
HttpModule,
FormsModule,
BrowserModule,
RouterModule.forRoot([{
path: '',
redirectTo: '/landing',
pathMatch: 'full'
}, {
path: 'login',
component: LoginComponent
}, {
path: 'docs',
component: DocsComponent,
canActivate: [AuthGuardService]
}, {
path: 'chess',
component: ChessComponent,
canActivate: [AuthGuardService]
}, {
path: 'landing',
component: LandingComponent,
}])
],
providers: [
AppService,
AuthService,
GuidService,
EchoService,
HtmlService,
AuthGuardService,
PermissionsService
],
declarations: [
AppComponent,
TinyComponent,
ChessComponent,
LoginComponent,
LandingComponent,
EnumerateSetValuesPipe,
EnumerateMapPipe,
EnumerateMapKeysPipe,
EnumerateMapValuesPipe,
EnumerateObjectPipe,
EnumerateObjectKeysPipe,
EnumerateObjectValuesPipe,
NeighbouringValuesPipe
],
bootstrap: [
AppComponent
]
})
export class AppModule {
public constructor() {
}
}
I'm unsure how to troubleshoot this issue. Any insights or suggestions?