基于两点

Question

让我们说，我有两点0到300，背景颜色为红色。

现在，我想绘制0到75绿色，75到150黄色。我有两个点和两个点，可以从Typescript视图模型类中给出值。

<div style="background-color: red">
   <div style="background-color: green">
   </div>
   <div style="background-color: yellow">
   </div>
</div>

我的场景非常复杂，有6-7种不同的颜色。我的方法是正确的还是有更好的方法？我的应用程序是TypeScript和Angular 2。

Answer 1

使用ngStyle或[style.background-color]

    <div [ngStyle]="randomcss()">  
        <div [ngStyle]="randomcss()">
   </div>
</div>

组件

export class AppComponent {
    randomcss(){
      // based on your points return color 
     return {'background-color':'red'}
    }
}