我的问题是当我在浏览器中更改 url 时，它总是会导致开始路由，当我键入路由器中存在的路径以外的其他内容时，我得到 404。
app-routing.module.ts
const routes: Routes = [
{path: "start", canActivate:[RoutingGuard], component: Start},
{path: "path-1", canActivate:[RoutingGuard], component: One},
{path: "path-2", canActivate:[RoutingGuard], component: Two},
{path: "path-3", canActivate:[RoutingGuard], component: Three},
{path: "path-4", canActivate:[RoutingGuard], component: Four},
{path: "", component: Public},
{path: "**", redirectTo: "", pathMatch:'full'}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
routeting-guard.service.ts：
canActivate() {
this._mysvc.isAuthorized().subscribe(data => this.auth = data);
if (!this.auth) {
this._router.navigate(['/']);
}
return this.auth;
}
我有一个登录名，在公共组件中，我有这种方法，如果用户登录，它会重定向到/start。
public.component.ts：
isAuthorized(authorized:boolean):void {
if (authorized) {
this._router.navigate(['/start']);
}
}
ngOnInit():void {
this._mysvc.isAuthorized().subscribe(this.isAuthorized.bind(this), this.isAuthorizedError);
}
索引.html：
<html lang="en">
<head>
<base href="/">
<!--<meta charset="UTF-8">-->
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
</head>
<body>
<app-root></app-root>
</body>
</html>
我使用重写配置，所以我跳过了 url 中的 #
rewrite.config：
RewriteRule /start/? /index.html [NC]
RewriteRule /path-1/? /index.html [NC]
RewriteRule /path-2/? /index.html [NC]
RewriteRule /path-3/? /index.html [NC]
RewriteRule /path-4/? /index.html [NC]
问题是您处理async请求sync：
canActivate(): Observable<boolean> {
return this._mysvc.isAuthorized().do((auth: boolean) => {
if (!auth) {
this._router.navigate(['/']);
}
});
}
为此，您需要导入do运算符：
import 'rxjs/add/operator/do'
或：
async canActivate(): Promise<boolean> {
if (!await this._mysvc.isAuthorized().toPromise()) {
this._router.navigate(['/']);
}
return auth;
}
为此，您需要导入toPromise运算符
import 'rxjs/add/operator/toPromise';