Angular 8 和 9 中提供和注入“Window”与 Window 之间有什么区别？

我有两个使用这些版本的 Angular 项目：

• 9.0.0-下一个.6
• 8.1.0

在版本 9 中我用它来提供和注入window目的：

@NgModule({
  providers: [
    {
      provide: Window,
      useValue: window
    },
  ]
})

export class TestComponent implements OnInit {
  constructor(@Inject(Window) private window: Window)
}

效果很好。

在版本 8 中采用这种方法会在编译期间引发警告和错误：

警告：无法解析 TestComponent 的所有参数...

我通过使用单引号解决了这个问题，如下所示：

@NgModule({
  providers: [
    {
      provide: 'Window',
      useValue: window
    },
  ]
})

export class TestComponent implements OnInit {
  constructor(@Inject('Window') private window: Window)
}

两个版本有什么区别？
Angular 8 和 9 的差异是什么导致了这个问题？

为了让您的应用程序能够使用服务器端渲染，我建议您不仅使用窗口令牌，而且还以 SSR 友好的方式创建此令牌，而无需引用window根本不。 Angular 内置了DOCUMENT用于访问的令牌document。这是我为我的项目使用的想法window通过代币：

import {DOCUMENT} from '@angular/common';
import {inject, InjectionToken} from '@angular/core';

export const WINDOW = new InjectionToken<Window>(
    'An abstraction over global window object',
    {
        factory: () => {
            const {defaultView} = inject(DOCUMENT);

            if (!defaultView) {
                throw new Error('Window is not available');
            }

            return defaultView;
        },
    },
);

Edit:由于这是人们经常需要的东西，我们使用这种技术创建了一个小型开源库，其中包含全局对象的注入令牌，因此您可以使用它：

https://github.com/ng-web-apis/common https://github.com/ng-web-apis/common

它有一个姊妹库，用于在 Angular Universal 中与 SSR 一起使用模拟：

https://github.com/ng-web-apis/universal https://github.com/ng-web-apis/universal

总的来说，请查看我们的 Angular 原生 API 中心：

https://ng-web-apis.github.io/ https://ng-web-apis.github.io/