错误:无法解析HomeComponent的所有参数:(?)

时间:2018-02-27 18:39:33

标签: angular angular-routing angular-meteor angular-router

我正在使用带有Angular的Meteor。 不知何故,每当我试图将 Router 依赖项放在组件的构造函数中时,它总是给我错误。

constructor(private router: Router) {}

删除路由器参数工作正常!

constructor() {}

我正在尝试使用组件ts中的this.router.navigate()从一个组件导航到另一个组件。

这是我得到的错误:

  

错误:无法解析HomeComponent的所有参数:(?)。

仍然是棱角分明的新人,一直试图解决这个问题!感谢你能帮助这个可怜的灵魂!

HomeComponent

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'home-component',
  templateUrl: './home.component.html'
})

export class HomeComponent {

  constructor(private router: Router) {}

}

的AppModule

import { NgModule, ErrorHandler } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppRoutingModule } from './app-routing.module';

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

import { HomeComponent } from '../components/home/home.component';
import { LoginComponent } from '../components/login/login.component';

import { MainPage } from '../pages/main/main';

@NgModule({
  declarations: [
    AppComponent,
    HomeComponent,
    LoginComponent,
    MainPage
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
  ],
  entryComponents: [
    AppComponent
  ],
  bootstrap: [AppComponent]
})

export class AppModule {}

AppRoutingModule

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

import { HomeComponent } from '../components/home/home.component';
import { LoginComponent } from '../components/login/login.component';

const routes: Routes = [
{ 
    path: '', 
    redirectTo: '/home', 
    pathMatch: 'full' 
},
{ 
    path: 'home', 
    component: HomeComponent 
},
{ 
    path: 'login', 
    component: LoginComponent 
}
];

@NgModule({
  imports: [RouterModule.forRoot(routes 
{ enableTracing: false } // <-- debugging purposes only
)],
  exports: [RouterModule]
})

export class AppRoutingModule {}

的package.json

"dependencies": {
"@agm/core": "^1.0.0-beta.2",
"@angular/animations": "^5.1.0",
"@angular/common": "^5.1.0",
"@angular/compiler": "^5.1.0",
"@angular/compiler-cli": "^5.1.0",
"@angular/core": "^5.1.0",
"@angular/forms": "^5.1.0",
"@angular/http": "^5.1.0",
"@angular/platform-browser": "^5.1.0",
"@angular/platform-browser-dynamic": "^5.1.0",
"@angular/platform-server": "^5.1.0",
"@angular/router": "^5.0.0",
"air-datepicker": "^2.2.3",
"babel-runtime": "^6.26.0",
"bcrypt": "^1.0.3",
"jarallax": "^1.9.3",
"jquery": "2.2.4",
"meteor-node-stubs": "^0.3.2",
"meteor-rxjs": "^0.4.8",
"moment": "^2.20.1",
"ngx-cookie": "^2.0.1",
"reflect-metadata": "^0.1.10",
"rxjs": "^5.5.6",
"stripe": "^5.4.0",
"zone.js": "^0.8.19"
},

"devDependencies": {
"@types/meteor": "^1.4.12",
"@types/meteor-accounts-phone": "0.0.5",
"@types/underscore": "^1.8.6",
"meteor-typings": "^1.4.1",
"typescript": "^2.6.2"
}

2 个答案:

答案 0 :(得分:0)

怪异。除了forRoot调用args中缺少,之外,我的代码中没有任何问题。可以吗?确实很奇怪 - 如果在这里粘贴你的代码不是一个错误,那么你应该有一个编译器错误,而你的IDE会发出警告。

@NgModule({
  imports: [RouterModule.forRoot(routes // , missing here
{ enableTracing: false }
)],
  exports: [RouterModule]
})

答案 1 :(得分:0)

奇怪的东西,但你可以尝试的一件事是明确地注入路由器

constructor(@Inject(Router) private router) {
    // use `this.router` which is the router provider
  }

如果它解决了这个问题,你可能在其他地方有循环依赖。