Angular 8-比较对象内部数组（JSON）的更好方法是什么？

我正在用Angular 8开发一个网站（第一次），我需要一些帮助。我在

服务处收到两个来自API的JSON。ts

：

  getCurso(): Observable<Curso[]>{
    return this.http.get<Curso[]>(this.cursos)
  }
  getCursoConductor(): Observable<CursoConductor[]> {
    return this.http.get<CursoConductor[]>(this.cursoConductores)
  }

还有一个来自

getCurso（）

正如您所注意到的，两者都有内部的

“id\u curso”

，我所做的是使用来自

getCurso（）

的数字或数组创建html表，并用

getcursorconductor（）填充这些表。

：

---

这是我得到的

而不是分别拥有两个集合，您可以这样做：

//您的typescript组件：
sortbyCurso（）{
this.service.getCurso（）.subscribe（（数据）=>{
this.listCursos=data['cur']
//确保在检索数据时调用getCursoConductor（）
this.getCursoConductor（）
})
}
getCursoFromId（idCurso:any）{
返回这个.listCursos.find（item=>item&&item.id\u curso==idCurso）；
}
getCursoConductor（）{
this.service.getCursoConductor（）.subscribe（（数据）=>{
//我们正在筛选从ListCurso接收的数据，仅针对现有的“id_curso”。
const listcursorconductor=data['dato'].filter（element=>！！this.getCurso（element.id\u curso）；
//然后，我们通过添加一个新属性“listCursoConductor”来更新实际的listCursos，该属性
//将包含所有关联的数据。
const updatedListCursos=this.listCursos.map（curso=>{
返回{…curso，listCursoConductor:listCursoConductor.filter（item=>item.id\u curso===curso.id\u curso）}；
});
this.listCursos=updatedListCursos；
})
}

然后在模板html中：

游标“{{Curso.nombre_Curso}”
伊尼西奥酒店
费卡鱼翅
埃斯塔多
卡内密码
Opcion
没有可用的数据。
{{curscoconductor.f_inicio}}
{{curscoconductor.f_fin}}
{{cursorconductor.estado}
{{curscoconductor.carnet_c}}

---

希望这会有帮助。

Wow，谢谢，它工作得很好，但我有一个问题，我如何隐藏整个div而不是显示“无数据可用”？如果您没有任何结果，可以在表部分像这样放置一个*ngIf：并在无数据可用的情况下删除tr。但如果您想隐藏整个div，可以筛选dir包含如下内容的ListCursor对象：this.listCursoros=updatedListCursors.filter（item=>！！item.listCursorsOconductor&&item.listCursorsOconductor.length>0）；

{
"dato": [
  {
"id_curso_conductor": 1,
"f_inicio": "2019-09-19T05:00:00.000+0000",
"f_fin": "2019-12-20T05:00:00.000+0000",
"estado": "1",
"carnet_c": "l584f",
"f_caducidad": "2022-06-20T05:00:00.000+0000",
"f_emision": "2017-06-20T05:00:00.000+0000",
"id_curso": 1,
"id_persona": 3
},
  {
"id_curso_conductor": 2,
"f_inicio": "2019-08-20T05:00:00.000+0000",
"f_fin": "2019-12-20T05:00:00.000+0000",
"estado": "1",
"carnet_c": "8574h",
"f_caducidad": "2023-04-05T05:00:00.000+0000",
"f_emision": "2017-04-08T05:00:00.000+0000",
"id_curso": 1,
"id_persona": 5
},
  {
"id_curso_conductor": 3,
"f_inicio": "2019-10-09T05:00:00.000+0000",
"f_fin": "2019-12-10T05:00:00.000+0000",
"estado": "1",
"carnet_c": "2685f",
"f_caducidad": "2022-08-10T05:00:00.000+0000",
"f_emision": "2017-08-09T05:00:00.000+0000",
"id_curso": 1,
"id_persona": 6
}
],
}

{
"cur": [
  {
"id_curso": 1,
"nombre_curso": "Curso Vial 2019I",
"tiempo_vigencia": "2019-10-31T05:00:00.000+0000",
"estado": "1"
},
  {
"id_curso": 2,
"nombre_curso": "Curso Vial 2019II",
"tiempo_vigencia": "2019-12-15T05:00:00.000+0000",
"estado": "1"
}
],
}

     <div class="container" *ngFor="let curso of listCursos">
        <h1>Curso "{{curso.nombre_curso}}"</h1>
        <table class="table table-bordered"> 
          <thead>
            <tr>
              <th>Fecha Inicio</th>
              <th>Fecha Fin</th>
              <th>Estado</th>
              <th>Codigo de Carnet</th>
              <th colspan="2">Opcion</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let cursoConductor of listCursoConductor">
              <td>{{cursoConductor.f_inicio}}</td>
              <td>{{cursoConductor.f_fin}}</td>
              <td>{{cursoConductor.estado}}</td>
              <td>{{cursoConductor.carnet_c}}</td>
              <td><button class="btn btn-warning fa fa-pencil" (click)="fillSelect()" (click)="loadRequisito(cursoConductor)" data-toggle="modal" data-target="#editreqmodal" ></button></td>
              <td><button class="btn btn-danger fa fa-trash" (click)="Eliminar(cursoConductor)"></button></td>
            </tr>
          </tbody>
        </table>
      </div>

curso: Curso = new Curso();
  cursoConductor: CursoConductor = new CursoConductor();
  listCursos: Curso[] = [];
  listCursoConductor: CursoConductor[] = [];
  constructor(private service: ServiceService, private router: Router) { }

  ngOnInit() {
    this.sortbyCurso();
  }
  sortbyCurso() {
    this.service.getCurso().subscribe((data) => {
      this.listCursos = data['cur']
    })
    this.getCursoConductor()
  }
  getCursoConductor() {
    this.service.getCursoConductor().subscribe((data) => {
      this.listCursoConductor = data['dato']
    })
  }