nativeElement对象，DOM操作

Question

我刚学会了关键字＆＃34; nativeElement＆＃34;不符合浏览器标准，例如：

let whatever = <HTMLDivElement>this.$elementRef.nativeElement;
whatever.style.display = 'none';

现在通过使用这样的渲染方法进行纠正。

this._render.setElementClass(whatever, 'display', 'none');

但是我也有以下内容：

this.whatever = <HTMLDivElement>this.$elementRef.nativeElement.querySelector(".myLookupClass");

请告知是否在这种情况下

".nativeElement.querySelector(".myLookupClass")"跨浏览器工作？如果没有，请建议另一种技术。

提前致谢。

Answer 1

您的代码适用于跨浏览器。首先，当您编写以下代码时，您需要了解实际为您提供角度的内容：

this.$elementRef.nativeElement

Angular将为您提供在DOM上呈现的组件的引用。这意味着Angular提供了一个简单的javascript对象，您可以在任何浏览器中使用此对象。所以继续使用你的代码。这将是任何浏览器的支持。

Answer 2

nativeElement与“跨浏览器”无关，而与“跨平台”有关，其中“platform”是DOM线程，Web Worker线程，服务器端呈现，......

如果要利用Angular或服务器端呈现（Angular Universal）提供的Web Worker功能，您应该或者需要避免访问nativeElement的任何属性或方法。传递nativeElement（比如Renderer2方法也好）。

正如在另一个答案中所提到的，nativeElement返回DOM元素，这在不是浏览器DOM线程的平台中不可用。

如果您的应用程序仅使用浏览器DOM线程，则避免访问nativeElement...属性和方法没有特别的好处，除非阻止您以后使用其他平台。