模板语法
服务端渲染
API / @angular/core

ElementRef

安全风险

Permitting direct access to the DOM can make your application more vulnerable to XSS attacks. Carefully review any use of ElementRef in your code. For more detail, see the Security Guide.

允许直接访问 DOM 会导致你的应用在 XSS 攻击前面更加脆弱。要仔细评审对 ElementRef 的代码。欲知详情，参见安全。

class ElementRef<T> { constructor(nativeElement: T) nativeElement: T }

构造函数

constructor(nativeElement: T)

参数

nativeElement

Type: T.

属性

属性名类型说明
nativeElement

The underlying native element or null if direct access to native elements is not supported (e.g. when the application runs in a web worker).

背后的原生元素，如果不支持直接访问原生元素，则为 null（比如：在 Web Worker 环境下运行此应用的时候）。

Use with caution
当心！

Use this API as the last resort when direct access to DOM is needed. Use templating and data-binding provided by Angular instead. Alternatively you can take a look at Renderer2which provides API that can safely be used even when direct access to native elements is not supported.

当需要直接访问 DOM 时，请把本 API 作为最后选择。优先使用 Angular 提供的模板和数据绑定机制。或者你还可以看看 Renderer2，它提供了可安全使用的 API —— 即使环境没有提供直接访问原生元素的功能。

Relying on direct DOM access creates tight coupling between your application and rendering layers which will make it impossible to separate the two and deploy your application into a web worker.

如果依赖直接访问 DOM 的方式，就可能在应用和渲染层之间产生紧耦合。这将导致无法分开两者，也就无法将应用发布到 Web Worker 中。