angular 路由跳转之后有跳到默认首页

最新推荐文章于 2023-02-28 14:34:28 发布

原创最新推荐文章于 2023-02-28 14:34:28 发布 · 1.9k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#html #angular6

Angular 专栏收录该内容

5 篇文章

订阅专栏

"在Angular应用中，点击‘忘记密码’链接导致路由错误，原本应跳转到忘记密码界面，但实际上路由变为空并重定向到了登录页面。问题在于HTML代码中‘忘记密码’链接使用了`href="#"`。解决方案是移除`href="#"`，只保留`(click)="forgetPwd()"`，以避免不必要的页面跳转。这表明#在URL中作为占位符时，点击不会改变路由，只有当其被有效链接替换时才生效。"

问题：点击“忘记密码”，跳转到忘记密码界面之后，路由里面为空了，有调到默认的login页面了

路由配置如下：

首页调整按钮：

 <li class="right_link"><a href="#" (click)="forgetPwd()">忘记密码</a></li>

app-routing.ts

const routes: Routes = [
  {
    path: '',
    redirectTo: 'login',
    pathMatch: 'full'
  },
  {
    path: 'login',
    component: LoginComponent
  },
  {
    path: 'forgetpwd',
    component: ForgetPwdComponent
  }
];

解决方法：将 <li class="right_link"><a href="#" (click)="forgetPwd()">忘记密码</a></li>中的href="#"去掉就好了。也就是改为

这个href="#"是一种临时链接的写法,这样写就是说这个链接目前不可用,点击了也不会有作用,还是会跳转到本页,当#被有效链接替换才会起作用。