为什么我的数据库中的数据没有显示在我的 Angular 表中？

问：

我有一个用Laravel制作的api，我在其中对我的SqlServer DB进行查询，以从.json格式的表中获取所有数据，然后我通过Axios从我的angular应用程序向端点发出请求，该端点是我的laravel api的旋转，以从该表中获取数据并在HTML表中显示其数据。

为了做到这一点，我在我的 Angular 组件中创建了一个接口，然后我将其导出。代码如下：

import { Component, OnInit } from '@angular/core';
import { EquiposTableService } from '../../../service/equipos-table.service';
import { Observable } from 'rxjs';

export interface Equipo {
  id: number;
  codigo: string;
  nomina: string;
  nombre: string;
  area: string;
  marca: string;
  modelo: string;
  noSerie: string;
  fecha: string;
  noFactura: string;
  proveedor: string;
  estado: string;
}

@Component ({
    selector: 'equiposBody',
    templateUrl: './equiposBody-component.component.html',
    styleUrls: ['./equiposBody-component.component.css']
})
export class equiposBodyComponent implements OnInit{
    equipos: Observable<Equipo[]>;
  constructor(private equiposService: EquiposTableService) {}
  
  async ngOnInit() {
    this.equipos = await this.equiposService.getEquipos();
  }
}

我已经这样做了，VScode 在这 2 行中给了我一个错误：

equipos: Observable<Equipo[]>;

VScode 在此行中提供的错误是“属性'equipos'没有初始值设定项，并且未在 constructor.ts（2564） 中明确分配”

在这里：

this.equipos = await this.equiposService.getEquipos();

VScode 在此行中提供的错误是“类型'AxiosResponse<any， any>'缺少类型'Observable<Equipo[]>'中的以下属性：source、operator、lift、subscribe 和 3 more.ts（2740）”

我假设如果我修复第一行，第二行将得到修复，但是当我尝试通过在构造函数中添加equipos变量来修复它时，它仍然会给出我的错误。

另一方面，我的 HTML 文件中的代码是这样的，请检查它是否正确：

<table class="table-fixed m-auto">
  <thead>
    <tr>
      <th class="px-3">id</th>
      <th class="px-3">Código</th>
      <th class="px-3">Nómina</th>
      <th class="px-3">Nombre</th>
      <th class="px-3">Area</th>
      <th class="px-3">Marca</th>
      <th class="px-3">Modelo</th>
      <th class="px-3">No. serie</th>
      <th class="px-3">Fecha</th>
      <th class="px-3">No. Factura</th>
      <th class="px-3">Proveedor</th>
      <th class="px-3">Estado</th>
      <th class="px-3">Accion</th>
    </tr>
  </thead>
  <tbody>
    <tr>
    <tr *ngFor="let equipo of equipos | async">
      <td class="px-3">{{equipo.id}}</td>
      <td class="px-3">{{equipo.codigo}}</td>
      <td class="px-3">{{equipo.nomina}}</td>
    </tr>
  </tbody>
</table>

我的服务（我使用 Axios 的地方）中的代码是 Next：

import { Injectable } from '@angular/core';
import axios from 'axios';

@Injectable({
  providedIn: 'root',
})
export class EquiposTableService {
  getEquipos() {
    return axios.get('http://[my local IP]:8000/api/json/equipos');
  }
}

我已经在我的组件的 ngOnInit（） 函数中使用了异步句子来获取推理，并将 Observable 属性添加到我的界面中，使其成功出现在我的 html 文件中，但它不起作用。

我知道mi API不是问题，因为我已经用Postman测试过它，而且效果很好，而且，在firefox中，我已经检查了我的应用程序是否从api接收了respose，它确实，它什么也没显示。

关于我的期望，我只想在我的 HTML 表中显示我的数据库的注册表或数据。