角材2のコンポーネントデコレータを拡張または上書きするにはどうすればよいですか？

Question

<mat-expansion-panel>コンポーネントの内側に<mat-nav-list>を入れ子にしています。実行時に、角度材料2は、特定のケースでhtmlを作成しています。

<div class="mat-expansion-panel-body">...</div> 

また、スタイルが割り当てられています。私は通常のようにコンポーネントスタイルシートを使用してこれらのスタイルを上書きすることはできません。ソースを通じて探し

は、私はこれを見ています：

/node_modules/@angular/material/esm2015/expansion.js 

MatExpansionPanel.decorators = [ 
{ type: Component, args: [{styles: [".mat-expansion-panel{transition:box-shadow 280ms cubic-bezier(.4,0,.2,1);box-sizing:content-box;display:block;margin:0;transition:margin 225ms cubic-bezier(.4,0,.2,1)}.mat-expansion-panel:not([class*=mat-elevation-z]){box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)}.mat-expansion-panel-content{overflow:hidden}.mat-expansion-panel-body{margin:0 24px 16px;overflow:auto} 
... 

私は、これはコンポーネントを作成している正確なコードではないと確信しているが、それは私が上書きしたいCSSを含んでいます：

... 
.mat-expansion-panel-body{margin:0 24px 16px;overflow:auto} 
... 

マージンを削除するには、どうすればデコレータを変更できますか？ は、ここに私の.tsファイルは、これまでに次のようになります。

@Component({ 
    selector: 'my-selector', 
    templateUrl: './my-selector.component.html', 
    styleUrls: ['./my-selector.component.scss'] 
}) 
export class MyComponent implements OnInit, OnDestroy {...} 

は、任意の提案をありがとう！

Answer 1

私は、動作するようだが、同様の問題を持つhere is a threadの解決策を考えてもらいたいと思います。

私はこのようなマージンを削除することができた：

私-template.component.html

<mat-expansion-panel *ngFor="let foo of bar" class="my-sidenav"> 
    <mat-expansion-panel-header> 
     ... 
    </mat-expansion-panel-header> 
    <mat-nav-list> 
     <mat-list-item>...</mat-list-item> 
    </mat-nav-list> 
</mat-expansion-panel> 

私-component.component.scss

/deep/ .my-sidenav { 
    .mat-expansion-panel-body { 
     margin: 0; 
    } 
}