angular - import { DOCUMENT } from '@angular/common' 的意义何在？如果我已经可以访问该文档

Question

为什么我们要费心使用 import { DOCUMENT } from '@angular/common'？

即使没有它，我也可以访问文档模块

document.getElementById('TestID).focus()

我发现导入的唯一区别是将其附加到 this 关键字。

this._document.getElementById('TestID').focus();

从 Angular 的通用模块导入 DOCUMENT 有什么真正的好处吗？

我做了一些研究，但看不到任何相关信息。

Answer 1

在我们的用例中，我们注入(inject) DOCUMENT 的最重要原因而不是直接使用它用于服务器端渲染。如果您调用document.xxx直接在任何常规生命周期 Hook 中，例如 ngOnInit/ngAfterViewInit ，您很可能会得到 document not defined SSR期间出错。使用DI注入(inject)可以避免这种情况。