【发布时间】:2020-02-29 04:28:40
【问题描述】:
我正在开发 Angular 应用程序。每次刷新浏览器,应用程序都会移动到主页。有什么方法可以保持在同一页面上?
更新:这是应用程序的路线。
export const secureRoutes: Routes = [
{path: '', component: DashboardComponent, pathMatch: 'full'},
{ path: 'dashboard', component: DashboardComponent, canActivate: [AuthGuard] },
{ path: 'user', component: UserComponent, canActivate: [AuthGuard] },
{ path: 'table', component: TableComponent, canActivate: [AuthGuard] },
{ path: 'typography', component: TypographyComponent, canActivate: [AuthGuard] },
{ path: 'icons', component: IconsComponent, canActivate: [AuthGuard] },
{ path: 'maps', component: MapsComponent, canActivate: [AuthGuard] },
{ path: 'notifications', component: NotificationsComponent, canActivate: [AuthGuard] },
{ path: 'upgrade', component: UpgradeComponent, canActivate: [AuthGuard] },
{ path: 'categories/new', component: AddEditCategoryComponent, canActivate: [AuthGuard] },
{ path: 'categories/view/:id', component: ViewCategoryComponent, canActivate: [AuthGuard] },
{ path: 'categories/edit/:id', component: AddEditCategoryComponent, canActivate: [AuthGuard] },
{ path: 'categories', component: CategoriesComponent, canActivate: [AuthGuard] },
{ path: 'categories/:category_id/view_product/:product_id',
component: ViewProductComponent, canActivate: [AuthGuard] },
{ path: 'categories/:category_id/new_product', component: AddEditProductComponent, canActivate: [AuthGuard] },
{ path: 'categories/:category_id/edit_product/:product_id',
component: AddEditProductComponent, canActivate: [AuthGuard] },
{ path: 'settings', component: SettingsComponent, canActivate: [AuthGuard] },
{ path: 'settings/edit', component: EditSettingsComponent, canActivate: [AuthGuard] },
{ path: 'users', component: UsersComponent, canActivate: [AuthGuard] },
{ path: 'users/view_client/:id', component: ClientComponent, canActivate: [AuthGuard] },
{ path: 'orders', component: OrdersComponent, canActivate: [AuthGuard], },
{ path: 'orders/:type/:id', component: OrderComponent, canActivate: [AuthGuard] },
{ path: 'adgroups', component: AdGroupsComponent, canActivate: [AuthGuard] },
{ path: 'adgroups/new', component: AddEditAdGroupComponent, canActivate: [AuthGuard] },
{ path: 'adgroups/view/:id', component: ViewAdGroupComponent, canActivate: [AuthGuard] },
{
path: '**',
component: PageNotFoundComponent
}
];
这里也是上述路由中使用的AuthGuard。
@Injectable()
export class AuthGuard implements CanActivate {
constructor(
private router: Router,
public afAuth: AngularFireAuth
) {
}
canActivate(): Observable<boolean> {
return this.afAuth.authState.pipe(map((user) => {
if (user) {
return true;
}
this.router.navigate(['/login'])
return false;
}))
}
}
【问题讨论】:
-
如何为您的应用程序提供服务?
-
您是从页面还是组件刷新?如果您从组件中刷新,那么它只是一个模式,它将加载您所在的最后一页,在您的案例主页中。
-
你的路由配置是什么样的?
-
我更新了帖子并包含了应用的路线
-
您的身份验证守卫在做什么?失败时是否会重新路由到另一个页面?
标签: angular angular6 angular7 angular2-routing angular8