如何在Angular 4中为ng-template标签赋予样式？

Question

 <mat-dialog-content class="no-scroll" >

  <mat-divider></mat-divider>
  <section class="row add-widget-container">
   <span class="col-md-4 text-center">
      <h4>Available widgets</h4>
        <div class="selectable-widgets">
            <mat-button-toggle-group #group="matButtonToggleGroup" [(ngModel)]="selectedWidget" (change)="showPreview()" [vertical]="true">
                <mat-button-toggle color="primary" *ngFor="let widget of availableWidgets" 
                    [value]="widget">{{widget.data.title}}</mat-button-toggle>
            </mat-button-toggle-group>
        </div>
   </span>
   <span class="col-md-4">
      <h4 class="text-center">Preview</h4>
    <ng-template #widgetPreview ></ng-template>
  </span>
  <span class="col-md-4 text-center">
      <h4>Options</h4>  

  </span>
  </section>
</mat-dialog-content>

我们如何设置ng-template标签的高度和宽度 。我曾尝试在ng-template代码中添加一些内联样式，但是这并没有体现出来

Answer 1

根据Angular文档，

<ng-template>

<ng-template>是用于呈现HTML的Angular元素。它永远不会直接显示。实际上，在渲染视图之前，Angular用注释替换了<ng-template>及其内容。

如果没有结构指令，而仅将某些元素包装在<ng-template>中，则这些元素会消失。这就是<ng-template>中元素的命运。