javascript - 如何使用 Angular 路由？

Question

我有一个页面(比如 page3)可以从其他两个页面访问，比如 page1(父 URL 将是 parent1 - parent1/page1)和页面 2(父 URL 将是 parent2 - parent2/page2)。

由于默认情况下 Angular 会更改 URL，所以我只想在我从第 2 页导航时阻止 URL 更改，并且当我从第 1 页(对于所有具有父 URL 作为 parent1 的页面)导航时，我希望 URL 正常更改。

我们可以这样做

router.navigate('page2',{skipLocationChange: true});

但是由于我有更多页面，如 page4、page5、page6 等，而且我想防止仅针对特定页面更改位置，我该如何在公共(public)位置执行此操作。

Answer 1

您可以订阅特定组件中的路由器事件: https://v2.angular.io/docs/ts/latest/api/router/index/NavigationStart-class.html

在事件处理程序中(导航启动后)，您可以检查什么是父 URL 并使用 history.replaceState() 等方法覆盖它

您可以创建全局配置注入(inject)，它会定义所有规则(即覆盖哪些 URL，哪些不覆盖)。这样你就不需要重构所有的 router.navigate 而只需在组件类中为每个组件指定一次规则:

constructor(router: Router, overrideUrlService: overrideUrlService) {
  router.events.subscribe(event => {
    if(event instanceof NavigationStart) {
        //have the override logic in some injectable service
        overrideUrlService.checkUrl(event.url);
    }
  }
});