主页 / user-16888389

Cortex's questions

Martin Hope
Cortex
Asked: 2025-04-11 20:09:31 +0800 CST
  • 7

我在 router-outlet 指令中遇到了这个错误。谁能帮我解释一下为什么会出现这种情况，我完全不知道。所有导入都已添加到 app.module.ts 文件中，但它仍然提示“请验证 router-outlet 是否是 Angular 组件”。我使用的是 Angular 19，这个错误只在最新版本中出现，因为之前的版本中运行的是相同的代码。

 **app.component.html**
    
        <router-outlet></router-outlet>
    
    **app.component.ts**
    
        import { Component } from '@angular/core';
        
        @Component({
          selector: 'app-root',
          standalone:false,
          templateUrl: './app.component.html',
          styleUrl: './app.component.css'
        })
        export class AppComponent {
          title = 'angular_19';
        
        }
    
    **app.module.ts**
    
        import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from "@angular/core";
    import { AppComponent } from "./app.component";
    import { BrowserModule } from "@angular/platform-browser";
    import { AppRoutingModule } from "./app.routes";
    import { DashboardComponent } from "./dashboard/dashboard.component";
    
    @NgModule({
        declarations:[
            AppComponent,
            DashboardComponent],
        imports:[
            BrowserModule,
            AppRoutingModule,
            RouterModule
        ],
        providers:[],
        bootstrap:[AppComponent],
        schemas:[CUSTOM_ELEMENTS_SCHEMA]
    
    
    })
    export class AppModule{}
    **app.router.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',
            component: DashboardComponent
        },  
        {
            path: 'dashboard',
            component: DashboardComponent
        }
    ];
    
    @NgModule({
        imports:[RouterModule.forRoot(routes)],
        exports:[RouterModule]
    })
    export class AppRoutingModule{
    
    }
**main.ts**

import { AppComponent } from './app/app.component';
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';


platformBrowserDynamic().bootstrapModule(AppComponent)
.catch(err=>console.error(err))
angular