为什么没有数据源的<mat table>不显示在Angular 7中

我想用 <mat-table> 显示选项的名称及其对应的给定值(供用户更改)。由于选项可能需要通过不同的方式(例如滑动切换或mat选择)设置它们的值,因此我必须在没有数据源的情况下将其记录下来(或者至少据我所知,不能在typescript文件中使用预先编写的html标记)。

因此,我的MWE是:

<mat-table>
    <mat-header-row *matHeaderRowDef>
        <mat-header-cell>header</mat-header-cell>
    </mat-header-row>

    <mat-row>
        <mat-cell>
             cell
        </mat-cell>
    </mat-row>
</mat-table>

然而,当我查看页面时,它只显示一行,没有任何字符串。我想在一小时内使用这张桌子 <mat-card> (或者更确切地说 <mat-card-content> ),但即使我在那之外尝试,我也只得到了那条线,别的什么都没有。这是mat卡中的外观:

如何正确显示表格?

*编辑:* 既然它是被要求的,这里也是答案。ts文件。

import { Component, OnInit, ViewChild } from '@angular/core';

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


  @ViewChild('resolutionSelect') resolutionSelect: MatSelect;

  resolutions: ResolutionOptionsInterface[] = [
    { value: '1920 x 1080' },
    { value: '800 x 600' }
  ];
  public selectedRes = this.resolutions[0];
  public isFullscreenEnabled = true;

  constructor() { }

  ngOnInit() {
    console.log("in oninit");
    this.resolutionSelect.value = this.resolutions[0].value;
  }

}

这比最简单的工作示例多一点,所以我将解释一下:

• 我的选择之一是分辨率,它可以由 mat-select
• 这 垫子选择 在html文件中定义如下
• 这 垫子选择 将给定预定义的值,如 resolutions 大堆

• 我的另一个选择就是选择全屏,让它成为一个 mat-slide-toggle (然而,这一点尚未完全实施)

  <mat-select #resolutionSelect fxFlex="200px"> <mat-option *ngFor="let res of resolutions" [value]="res.value" class="right"> {{res.value}} </mat-option> </mat-select>