角2/4和SCSS语法不与构建督促

Question

工作，我有问题，SCSS。我有项目组件，它包含在他的html代码4 app-tile's中。我有不同的类重定向到每个图块和 这project.component.html代码的样子：

<app-tile class="a"></app-tile> 
<app-tile class="b"></app-tile> 
<app-tile class="c"></app-tile> 
<app-tile class="d"></app-tile> 

Tile.component.html代码：

<div class="tile"> 
    text 
</div> 

现在奇怪的问题。瓷砖的风格的作品，只有当我使用形式： tile.component.scss：

.a 
.tile { color: red; } 

.b 
.tile { color: blue; } 

.c 
.tile { color: green; } 

.d 
.tile { color: purple; } 

当我尝试在一个行设置选择它dosent工作：

.a .tile { ... } // bad way 

..但我完全不知道为什么？好吧，我可以接受的语法，作为最后的手段它的作品。问题是，当我尝试建立与--prod项目，为有特殊类.tile的样式（.A，.B，.C，.D ）没有加载...有人可以帮我解决这种情况吗？

编辑：

如果我设置：

.a .tile { color: red; } 

..in开发人员工具 - >元素 - HTML代码中，我看到：

.a[_ngcontent-c11] .tile[_ngcontent-c11] { 
    color: red; 
} 

但是当我设置：

.a 
.tile { color: red; } 

我得到：

.a 
.tile [_ngcontent-c11] { color: red; } 

这是如何影响这个问题的？

Answer 1

试试这个：

.a { color: red; } 

.b { color: blue; } 

.c { color: green; } 

.d { color: purple; } 

Answer 2

答案是，加

@Component({ 
    ... 
    encapsulation: ViewEncapsulation.None, 
    ... 
}) 

到project.component。