使用角度2样式绑定绑定rgb颜色值

Pas*_*cal 3 angular2-template angular

我想将来自后端的rgb值(例如"200,55,100")绑定到div的背景颜色.

这不起作用,它会抛出模板解析异常.

<div [style.background-color]="rgb({{model.color}})"
Run Code Online (Sandbox Code Playgroud)

我该怎么做?

UPDATE

<div [style.background-color]="s.getColor()"> class="md-chip" *ngFor="let s of sums">
    <div class="md-chip-img">
        <span style="text-align:center" class="md-chip-span">X</span>
    </div>
    <span class="md-chip-text">{{s.subjectName}}</span>
</div>
Run Code Online (Sandbox Code Playgroud)

Sjo*_*erd 6

您不能同时使用属性绑定([]语法)和插值({{}}语法).原因是Angular2在插值的幕后创建了一个属性绑定(另请参阅插值上的Angular2文档).

我建议用插值来尝试以下内容:

<div style.background-color="rgb({{model.color}})">...</div>
Run Code Online (Sandbox Code Playgroud)

或者,如果要使用属性绑定,则以下内容应该起作用:

<div [style.background-color]="'rgb(' + model.color + ')'">...</div>
Run Code Online (Sandbox Code Playgroud)

getColorString()返回rgb值的计算字符串的方法在哪里:

public getColorString(): string {
  return 'rgb(200, 55, 100)';
}
Run Code Online (Sandbox Code Playgroud)