Question

我正在尝试解析一组共享相同结构的URL的正确路径。我有路径/:id/:areaId和/:id/:cityId，这是出于SEO的原因设计完成的。当我实现它时，我需要知道:areaId是否存在（通过进行API调用），如果不存在，那么我将尝试检查:cityId是否存在以导航到它。

我首先想到的是我途中的canActivate，因为我需要注入一项服务，这对我来说似乎很自然。我实现了防护并将其应用于area组件，这里的麻烦是canActivate为false时，因为导航停止了。我一直在阅读有关使用urlMatchers的信息，但是我认为我没有段中需要的所有信息，并且使用Angular 2 different components with same route之类的方法注入服务对我来说似乎是错误的，而且如果我尝试直接导航到URL，而不是通过主页导航-当我直接导航时，未定义注入器。

我的问题是，使用防护措施或类似方法，如果防护结果为假，我可以“导航到下一个匹配的URL”吗？

作为参考，我的守卫看起来像这样：

@Injectable()
export class AreaGuard implements CanActivate {
    constructor(private areasService: AreasService) { }

    canActivate(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
        const areaId= route.params['areaId'];
        return this.areasService.isArea(areaId)
                                .then(a => {
                                    return true;
                                })
                                .catch(e => {
                                    console.log('Checking area', e);
                                    return false;
                                });
    }
}

Answer 1

如果我是您，我将创建一个Component来处理此规范。我不建议在Guards内进行HTTP调用。

您只能只有一条路线并加载新创建的组件。进行HTTP调用，然后使用简单的*ngIf就可以确定哪个组件加载。

角度9相同的路径路径不同的组件

1 个答案: