ts+angular 路由跳转

在TypeScript (TS) 和 Angular 中，路由跳转通常通过`RouterModule`模块提供的服务和指令来完成。以下是一个简单的步骤概述：

1. **安装依赖**：首先，确保你在Angular项目中已经安装了`@angular/router`模块，如果还没有，可以运行`ng add @angular/router`。

2. **配置路由模块**：在`app-routing.module.ts`文件中，你需要导入`RouterModule`, `Routes`以及需要的组件。然后定义你的路由规则，如这样：

import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './home/home.component';
import { AboutComponent } from './about/about.component';

const routes: Routes = [
  { path: '', component: HomeComponent }, // 主页
  { path: 'about', component: AboutComponent } // 关于页面
];

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

3. **导航到特定路线**：在组件的HTML模板中，你可以使用`routerLink`指令来进行路由跳转，或者在组件内部使用`this.router.navigate`方法：

<!-- 使用routerLink -->
<a routerLink="/about">关于</a>

<!-- 或者在ts中动态跳转 -->
<button (click)="goToAbout()">点击去关于</button>
ngOnInit() {
  goToAbout();
}

goToAbout() {
  this.router.navigate(['/about']);
}

4. **路由守卫（Optional）**：如果你想控制哪些用户、何时能访问某些路由，可以使用`CanActivate`守卫或其他类型的守卫。