组件的角度4材料自定义颜色

Question

是否可以在Angular 4的材质组件中添加自定义（HEX）颜色？ 例如是这样的：

<div *ngFor="let factor of factors"> 
    <button md-button color="factor.color">Button</button> 
</div> 

哪里factor.color是字符串中的十六进制格式（例如“#CCC”）

Answer 1

您可以使用[style.color]属性和有关转换的一些有用的帖子六码RGB：

DEMO

HTML：

<button mat-button [style.color]="hexToRgb(factor.color)">Click me</button> 

打字稿：

.... 

hexToRgb(hex) { 
    hex = hex.replace("#",''); 
    let arrBuff = new ArrayBuffer(4); 
    let vw = new DataView(arrBuff); 
    vw.setUint32(0,parseInt(hex, 16),false); 
    let arrByte = new Uint8Array(arrBuff); 

    return 'rgb(' + arrByte[1] + "," + arrByte[2] + "," + arrByte[3] +')'; 
}