angular2子评论如何扩展父样式

Question

我有两个组件，我希望内部组件扩展外部组件样式

@Component({
    selector: 'parent',
    style: [ '.panel{width:100px;height:100px;border:1px solid #ccc}' ],
    template: 'parent'
})

class ParentComponent 
{
}

@Component({
    selector: 'child',
    template: '<div class=".panel"></div>'
})

class ChildComponent 
{
}

像这样使用我想显示一个正方形

<parent>
    <child></child>
</parent>

Answer 1

看看ViewEncapsulation为您的子组件打开。您可以将子组件的 View 封装设置为无，以便它将继承父样式:

import {ViewEncapsulation} from "@angular/core"
@Component({
    encapsulation: ViewEncapsulation.None,
    selector: 'child',
    template: '<div class=".panel"></div>'
}) 

我从未真正针对此用例测试过它，但您也许可以用它做一些事情。