0

所以，我已经对这个主题进行了很多搜索，但我找不到这个错误。<router-outlet> is not a known element当我尝试实现路由器时出现错误。

这是我的app-routing.module.ts：

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

import { DashboardComponent } from './dashboard/dashboard.component';

const routes: Routes = [
    { path: '', redirectTo: 'dashboard', pathMatch: 'full' },
    { path: 'dashboard', component: DashboardComponent},
];

@NgModule({
    imports: [RouterModule.forRoot(routes)],
    exports: [RouterModule]
})
export class AppRoutingModule { }

我的app.module.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { HttpModule } from '@angular/http';
import { LocationStrategy, HashLocationStrategy } from '@angular/common';


// Declarations
import { RootComponent } from './root/root.component';
import { DashboardComponent } from './dashboard/dashboard.component';

// Imports
import { HttpClientModule } from '@angular/common/http';
import { HttpClientJsonpModule } from '@angular/common/http';
import { DalModule } from './dal/dal.module';
import { RootModule } from './root/root.module';
import { TranslationModule } from './translation/translation.module';
import { AppRoutingModule } from './app-routing.module';


@NgModule({
    declarations: [DashboardComponent],
    imports: [
        DalModule,
        FormsModule,
        BrowserModule,
        HttpClientModule,
        HttpClientJsonpModule,
        RootModule,
        AppRoutingModule,
        HttpModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [RootComponent]
})
export class AppModule { }

这是我的模板：

<div class="content">
    <div class="container-fluid">
       <router-outlet></router-outlet>
    </div>
</div>

一切似乎都很好，当我进行搜索时，我似乎完全有我应该做的事情来让它工作。

谢谢 ！

4

1 回答 1

0

在你的app.module.ts我猜你RootComponent是AppComponent大多数 Angular 应用程序中的典型，因为这是你在应用程序的根目录中引导的组件。

为了使用组件，您必须首先通过声明将其注册到模块中。在您app.module.ts添加RootComponent到您的声明数组中。

@NgModule({
    declarations: [RootComponent, DashboardComponent],
    imports: [
        DalModule,
        FormsModule,
        BrowserModule,
        HttpClientModule,
        HttpClientJsonpModule,
        RootModule,
        AppRoutingModule,
        HttpModule,
        RouterModule
    ],
    providers: [],
    bootstrap: [RootComponent]
})
于 2018-03-13T01:23:28.050 回答