Angular 2如何单独更改每个组件的组件背景颜色

Question

我有组件A和组件B.

我希望组件A背景颜色为黑色。

我希望组件B的背景颜色为黄色。

如果我修改了主style.css中的bg颜色，那么该颜色将在我的应用程序中全局设置。

如果我尝试修改组件css文件中的bg颜色，则不会影响body bg颜色。

有没有办法在加载时单独修改每个组件的bg颜色？

Answer 1

@Component({... }) 
class MyComponent {   constructor() {
  this.bgColor = this.getRandomColor();   }

  @HostBinding('style.background-color')    
  bgColor;

  getRandomColor() {
    var letters = '0123456789ABCDEF';
    var color = '#';
    for (var i = 0; i < 6; i++ ) {
        color += letters[Math.floor(Math.random() * 16)];
    }
    return color;   
  } 
}

感谢因为问题标题不好而忽略了我的答案

检查其他答案
- Style html,body from web component (Angular 2)
- Add class to body on Angular2
- Angular 2.x bind class on body tag
- ......