Angular 表未显示在浏览器中

我的app.component.html如下所示：

<table>
<th>
  <td>Name</td>
  <td>Mobile</td>
  <td>Email</td>
</th>

<tr *ngFor="let user of TableData">
  <td>{{user.name}}</td>
  <td>{{user.mobile}}</td>
  <td>{{user.email}}</td>
</tr>

</table>

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})

export class AppComponent {
 TableData: any = [];
 ShowEditTable: boolean = false;
 EditRowID: any = '';
 constructor() {
   this.TableData = [
    {name: 'Satish', mobile: '8979789787', email: 'aa@asasd.dad'},
    {name: 'Ram', mobile: '8979789987', email: 'opooop@asasd.dad'},
   ];
 }
}

---

该表未显示在浏览器中

请按如下所示更改模板代码

<div>
  <table>
    <thead>
      <tr>
        <td>Name</td>
        <td>Mobile</td>
        <td>Email</td>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let user of TableData">
        <td>{{user.name}}</td>
        <td>{{user.mobile}}</td>
        <td>{{user.email}}</td>
      </tr>
    </tbody>
  </table>
</div>

名称
可移动的
电子邮件
{{user.name}
{{user.mobile}}
{{user.email}

---

更改模板代码如下：

<div>
  <table>
    <thead>
      <tr>
        <td>Name</td>
        <td>Mobile</td>
        <td>Email</td>
      </tr>
    </thead>
    <tbody>
      <tr *ngFor="let user of TableData">
        <td>{{user.name}}</td>
        <td>{{user.mobile}}</td>
        <td>{{user.email}}</td>
      </tr>
    </tbody>
  </table>
</div>

名称
可移动的
电子邮件
{{user.name}
{{user.mobile}}
{{user.email}

---

如果答案有帮助请投票注意答案是否有帮助