Angular如何创建路由以及如何配置路由导航

废话不多说直接进入正题,首先要创建好项目。

第一步:安装Angular路由

输入以下指令

npm install @angular/router

第二部:通过指令创建Angular路由守卫

ng g guard guards/auth(自定义名字) 

第二部:在module文件里面导入①路由导航组件②其他类组件,之后再

NgModule({
  declarations: [
    AppComponent,
     //在这里导入其他类组件
  ],

然后配置路由,在imports中导入 RouterModule.forRoot(路由变量名)

const routes: Routes = [
  { path: 'home', component: HomeComponent,canActivate:[loginGuradsGuard]  },
  // 添加更多路由...
 
];

后面关于路由条件的设定要在CanActivate中设置

import { CanActivateFn } from '@angular/router';

export const loginGuradsGuard: CanActivateFn = (route, state) => {
  console.log("启动");
  return false;
};

以上

posted @   しゅおく  阅读(35)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
· 被坑几百块钱后,我竟然真的恢复了删除的微信聊天记录!
· 没有Manus邀请码?试试免邀请码的MGX或者开源的OpenManus吧
· 园子的第一款AI主题卫衣上架——"HELLO! HOW CAN I ASSIST YOU TODAY
· 【自荐】一款简洁、开源的在线白板工具 Drawnix
点击右上角即可分享
微信分享提示