Question

我必须通过应用某些条件，根据通过单选按钮接收的输入，在屏幕上显示数据。从单选按钮中选择名称属性时，我还需要帮助来获取对象的ID。这是对象数组

  arrayOfObjects = [
    {hiringTypeName : "lateral", hiringTypeId :1,compCode : "IB", compId : 400},
    {hiringTypeName : "new", hiringTypeId :2,compCode : "IB", compId : 401},
    {hiringTypeName : "lateral", hiringTypeId :3,compCode : "BITS", compId : 402},
    {hiringTypeName : "new", hiringTypeId :4,compCode : "BITS", compId : 403},
  ]

  moduleArray =[
    {processName : "offer", processId : 1,data:[{
      name : "demo1", 
      id : 1
    }]},
    {processName : "hire", processId : 2,data:[{
      name : "demo1", 
      id : 1
    }]}
  ]

从另一个API调用中，我将从服务器获取数据，该数据看起来像（*仅用于参考）

  dummyData = [
        {processName : "offer", 
         processId : 1,
         hiringTypeId :1,
         data:[{
            showName : "demo1", showId : 1
    }]},
        {processName : "hire", 
        processId : 2,
        hiringTypeId :1,
        data:[{
            showName : "demo2", showId : 1
    }]},
        {processName : "offer", 
        processId : 2,
        hiringTypeId :3,
        data:[{
            showName : "demo3", showId : 1
    }]},
  ]

它将具有processName，processId和companyHiringtypeId，并且这三个的每种组合将具有与之关联的称为“数据”的对象数组。我想根据选择在屏幕上的数据中显示showName。

这是我创建的stackblitz，其中包含所有基本数组和表格，并在.ts文件的注释中描述了我需要的内容。代码尽可能地简洁。请要求我进一步澄清。谢谢

Answer 1

我根据您的最后评论对答案进行了修改。在app.component.ts中：


  showDummyData() {
    this.selectedDummyData = this.dummyData.filter(a => a.processName === this.selected 
                                                  && a.hiringTypeId === +this.selected1);
  }

在app.component.html中：

   <div *ngFor="let item of selectedDummyData">
     {{item.data[0].showName}}
   </div>

这里是基于您的代码的Stackblitz：https://stackblitz.com/edit/angular-fpqbiv

选择两个单选按钮，然后单击“显示选定的虚拟数据”。

根据从表单中选择的值在屏幕上显示数据

1 个答案: