2

我希望将window.location搜索参数中的值传递给依赖提供者工厂的主体，理想情况下以惯用的 Angular 方式。

用例：编写我的第一个 Angular 应用程序我的应用程序在一个端口上运行，后端服务器在另一个端口上。我想附加&backend=localhost:12345到 URL 以使应用程序与该主机对话。这是只读的，手写到 URL 栏。我不想导航到这样的 URL。

考虑的方法：

  1. 直接使用window.location.href。使代码依赖于浏览器，可能会破坏测试装置或任何其他想要在浏览器之外执行代码的东西。
  2. 使用PlatformLocation.href. 文档说“应用程序开发人员不应直接使用此类。”</li>
  3. 使用Location.path(). 似乎有效，但似乎也没有提供任何访问完整 URL 的方法。独立路径包含查询参数，但作为构造函数的参数似乎无效URL，所以我最终得到了类似new URL('http://no-such-host/' + location.path()).searchParams.get('backend'). 算不上优雅。
  4. 以某种方式使用ActivatedRoute.queryParams。将 anActivatedRoute注入我的工厂显然会给我一个默认实例（字符串化为Route(url:'', path:'')），因此查询参数似乎不存在。并且该queryParams方法返回一个Observable，而从我在网上阅读的内容来看，为提供者工厂使用异步代码流充其量是棘手的。

有没有更好的方法让工厂根据查询参数做出决策？

4

1 回答 1

1

如果我理解正确，您想以backend编程方式从您的路径中获取查询参数。

您可以像下面的示例一样使用 Angular 路由器：

@Service()
export class MyFactory {
  constructor(private route: ActivatedRoute) {}

  fetch() {
    const backendUrl = route.snapshot.queryParams['backend'] || 'defaultUrl';

    // do something here
  }
}

或者，您可以使用该Location对象来获取如下查询参数：

const backendUrl = new URLSearchParams(Location.search).get('backend');

// do something here
于 2020-11-12T17:34:36.000 回答