Angular 5 服务中的窗口对象答案

【问题标题】：Window object in angular 5 serviceAngular 5 服务中的窗口对象
【发布时间】：2020-02-03 15:00:26
【问题描述】：

我在 Angular 中有项目，特别是用户面板。所有页面都在 php 中，只是面板中的角度。如何在服务中使用window 对象？

我想使用 window.location 与 HTML 中的 href="/" 完全相同的操作，这会将我返回到主站点的角度项目（面板）之外。为什么？当我尝试获取用户并返回例如 401 的状态时，404 用户无法访问面板，它必须导航到主站点。

我尝试了路由navigate 或navigateByURl 的几个选项，但地址总是在Angular 中设置为baseHref，所以我不能出去。我尝试在提供程序中传递{provide: Window, useValue: window }，将窗口注入服务中的构造函数，这在我的本地主机上运行，但是当我在cli 中运行ng build 时，它会向我发送一个错误：

错误中的错误：无法解析 UserService 中的所有参数 ../my-app/src/app/user.service.ts: (?, [object Object], [object 对象]，[对象对象]，[对象对象]）。

有人吗？

在 AppModule 中：

providers: [UserService, DatePipe, {provide: Window, useValue: window }],

在用户服务中：

constructor(private window: Window, private location: Location, private HttpClient: HttpClient, private route: ActivatedRoute, private router: Router){};

并在 UserService 中导航状态：

if(data == 403) {
  this.setError('You must log in', 'danger');

  this.window.location.assign("/");
  ...
}

【问题讨论】：

可以分享代码吗
正在编辑中。我无法显示所有代码
试试window.location.assign("/"); 没有这个。要访问窗口，您不必使用它。我也相信没有必要导入/提供窗口。
我重新安装了我的 npm 包（发现了类似的问题），然后我删除了 'this' 并导入/提供，它可以工作了！谢谢！
如果您删除 this.window 和注入，您将禁用窗口的整体 DI：所以它当然可以工作，但很难测试，例如这打败了 DependencyInjection 背后的 wohloe 想法。

标签： typescript angular5

【解决方案1】：

ERROR in Error: Can't resolve all parameters for UserService in ../my-
app/src/app/user.service.ts: (?, [object Object], [object Object], 
[object Object], [object Object]).

出现这个错误是因为 Angular 试图将 Window 和 Location 注入到您的服务中，并且找不到带有 @Injectable 装饰器的相应类。 @Injectable 装饰器表明 Angular DI 系统用于创建该类的一个或多个实例。 window 也是一个全局可访问的对象。

所以你可以用window.location.assign("/");代替this.window.location.assign("/");

或者任何一个：

window.location.href = 'http://...';
window.location = 'http://...';

【讨论】：