通过替换当前页面重定向到新页面

Question

我的目标：用户在欢迎页面(应用程序组件html(中，当点击按钮时，他应该能够转到另一个html页面。我查看了教程，知道我应该使用路由来做这件事，但无论我做什么，我都无法用下面的代码完成这件简单的事情，我点击按钮url更改，但我看不到hizmetrimiz文件的内部内容html：

应用程序组件Html文件：

<app-header></app-header>
<button routerLink="/hizmetlerimiz">click me</button>
<app-footer></app-footer>

应用程序例程模块.ts文件：

const routes: Routes = [
{
path: 'hizmetlerimiz',
component: HizmetlerimizComponent,
},
{
path: '',
component: AppComponent,
}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }

Hizmetrimiz组件：

import { Component, OnInit } from '@angular/core';
@Component({
selector: 'hizmetlerimiz',
templateUrl: './hizmetlerimiz.component.html',
styleUrls: ['./hizmetlerimiz.component.css']
})
export class HizmetlerimizComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
}

Hitmetrimiz组件Html文件

<h5>hizmetlerimiz</h5>
<p>some hizmets</p>

Answer 1

您需要使用<router-outlet></router-outlet>。该标签是html内容的占位符，并填充了连接到当前路线的组件

所以它应该看起来像这样：

<app-header></app-header>
<router-outlet></router-outlet>
<button routerLink="/hizmetlerimiz">click me</button>
<app-footer></app-footer>