如何在Angular 2中将Object传递给NgStyle指令?

Emm*_*gas 9 angular-directive angular

我正在尝试使用NgStyle带有对象变量的指令,如下所示:

@Component({
      template: `
            <div [ngStyle]="object">
              some test text
           </div>`
    })

export class example {
    private object: string = "{background-color: 'white'}";
}
Run Code Online (Sandbox Code Playgroud)

我也试图与object = "background-color: 'red'"[ngStyle]="{object}",但似乎这是行不通的.我收到消息错误:

错误:未捕获(在承诺中):由以下原因引起的错误:找不到支持对象'{color:'white'}'(...)consoleError @ VM1051 zone.js@0.6.21?main = browser:346_loop_1 @ VM1051 zone. js@0.6.21?main = browser:371drainMicroTaskQueue @ VM1051 zone.js@0.6.21?main = browser:375ZoneTask.invoke @ VM1051 zone.js@0.6.21?main = browser:297

我究竟做错了什么?

Ste*_*ota 18

不要传递string[ngStyle],传递Object,它会工作:

private object: Object = { 'background-color': 'red'};
Run Code Online (Sandbox Code Playgroud)


Far*_*i78 8

我有一个与ngStyle类似的问题,并修复如下:

[ngStyle]="{'top.px':dtPickerTop, 'left.px':dtPickerLeft}"
Run Code Online (Sandbox Code Playgroud)

dtPickerTop和dtPickerLeft基于click事件在我的组件中设置.

添加.px使它工作,而没有它,它似乎没有.