错误_renderer.setElementStyle"无法在[null]中设置未定义的属性'background-color'"

Nir*_*rtz 8 html angular2-forms angular2-directives angular2-template angular

我在angular2udemy课程中学习angular2,老师写了一个突出显示html元素的指令.

我试图做休闲,但对我来说_renderer.setElementStyle抛出异常.

EXCEPTION:TypeError:无法在[null]中设置undefined的属性'background-color'

指令:

import {Directive, ElementRef, Renderer, OnInit} from 'angular2/core';

@Directive({
    selector: '[highlight-directive]'
})

export class HighlightDirective implements OnInit{
    private _defaultColor= 'green';

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

    ngOnInit(): any {
        this._renderer.setElementStyle(this._elmRef, "background-color", this._defaultColor);
        //this._elmRef.nativeElement.style.backgroundColor = this._defaultColor; //this way works fine.
    }
}
Run Code Online (Sandbox Code Playgroud)

我使用该指令的模板:

template: `
    <div highlight-directive>
        Highlight me
    </div>
    <br>
    <div highlight-directive>
        2 Highlight me 2
    </div>
`,
Run Code Online (Sandbox Code Playgroud)

教师工作区: 在此输入图像描述

任何人都能找到我做错的事吗?

谢谢.

Eri*_*nez 21

正如@NirSchwartz所建议的那样

由于beta.1渲染器ElementRef不再使用,但是a nativeElement,因此添加背景颜色的渲染器行应该如下所示

this._renderer.setElementStyle(this._elmRef.nativeElement, "background-color", this._defaultColor);
Run Code Online (Sandbox Code Playgroud)

您可以在CHANGELOG中检查所有这些更改.特别针对您的情况,您应该检查beta.1的更改日志(更改内容)