在Angular中使用选择器时，如何设置组件显示的大小？

/* 组件样式文件（例如：app.component.css） */
.my-component {
  width: 300px;
  height: 200px;
}

<!-- 组件模板文件（例如：app.component.html） -->
<div class="my-component">
  <!-- 组件内容 -->
</div>

<!-- 组件模板文件（例如：app.component.html） -->
<div style="width: 300px; height: 200px;">
  <!-- 组件内容 -->
</div>

<!-- 组件模板文件（例如：app.component.html） -->
<div [style.width.px]="componentWidth" [style.height.px]="componentHeight">
  <!-- 组件内容 -->
</div>

// 组件类文件（例如：app.component.ts）
export class AppComponent {
  componentWidth: number = 300;
  componentHeight: number = 200;
}