使用 Angular 2 渲染器和使用 nativeElement 之间的区别

Question

我想知道这段代码有什么区别：

export class SomeDirective implements OnInit {

    constructor(private _elRef: ElementRef){}

    ngOnInit(): any {
        this._elRef.nativeElement.style.backgroundColor = 'green';
    }
}

和这个：

export class SomeDirective implements OnInit {

    constructor(private _elRef: ElementRef, private _renderer: Renderer){}

    ngOnInit(): any {
        this._renderer.setElementStyle(this._elRef, 'background-color', 'green');
    }
}

我知道第二个比第一个有一些优点，我只需要知道这些优点具体是什么。

Answer 1

我的理解是这Renderer是 Angular2 中的抽象。这意味着根据执行上下文插入专用实现。例如，在浏览器中，通过网络工作者，从服务器端......

事实上，在某些情况下 DOM API 不可用。我想到了网络工作者和服务器执行。

看这个问题：

• Angular2：ElementRef nativeElement 与 querySelector 性能