Angular 角度路由页面成功,但未显示html内容
当我在导航栏中单击Home时,它会转到HomeURL,但不会显示html内容 这是我的app.routing.module.tsAngular 角度路由页面成功,但未显示html内容,angular,typescript,routes,angular-ui-router,Angular,Typescript,Routes,Angular Ui Router,当我在导航栏中单击Home时,它会转到HomeURL,但不会显示html内容 这是我的app.routing.module.ts import { Component, NgModule } from '@angular/core'; import { RouterModule, Routes } from '@angular/router'; import { HomeComponent } from './home/home.component'; const routes: Routes
import { Component, NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './home/home.component';
const routes: Routes = [
{path: 'home', component: HomeComponent}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
这是我的app.component.html
<nav class="navbar navbar-expand-md navbar-dark fixed-top bg-dark">
<div class="container-fluid">
<a class="navbar-brand" href="#">Fixed navbar</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav me-auto mb-2 mb-md-0">
<li class="nav-item">
<a class="nav-link " routerLink='home' routerLinkActive='active'>Home</a>
</li>
</ul>
</div>
</div>
</nav>
<div class = "container">
<router-outlet></router-outlet>
</div>
-
家
我认为问题在于这一行:
<a class="nav-link " routerLink='home' routerLinkActive='active'>Home</a>
主页
尝试在routerLink中的home之前添加(/),如下所示:
<a class="nav-link " routerLink='/home' routerLinkActive='active'>Home</a>
主页
由于他在应用程序组件(根)上,我认为这不是问题所在。不,这不是问题,它在HomeController的ts文件中呈现?请,您可以共享控制台输出吗?创建测试组件Home2Component并修改路由
,以临时使用此组件。这样,您将检查您的家庭组件是否存在问题。请显示控制台输出