代码之家 › 专栏 › 技术社区 › user68288

如何将同一数组的多个迭代按角度推进到一个更大的数组中,以用于动态的选项卡数?

angular arrays html

0

user68288 · 技术社区 · 8 年前

我使用for循环来创建一个数组,然后我需要将该数组推进到一个更大的数组中。我四处搜索,我让它工作,但大数组只包含3个未定义的对象。

for循环的代码:

FinalArray: any[] = [];

    this.databaseService.getclass(id, this.selectedSeries, this.selectedTierNbr, this.selectedAmount)
    .subscribe(classresults => this.classresults = classresults,
     error => console.log('ERROR!'),
     // Populate Bank Level Data using onComplete Observable function
     () => { for (const classresult of this.classresults) {
       this.selectedClassId = classresult.Class_ID;
       console.log(this.selectedClassId);
       this.databaseService.getbank(id, this.selectedS, this.selectedTierNbr, this.selectedAmount, this.selectedClassId)
       .subscribe(bankresults => this.bankresults = bankresults);
       this.FinalArray.push(this.bankresults);
       console.log(this.FinalArray);
     }
   }

以下是数据库服务中的数组导出类:

export class ClassResult {
  Id: number;
  Name: string;
  Group_Name: string;
  S_Id: number;
  S_Name: string;
  Class_ID: number;
  S_Class: string;
  Tier_Nbr: number;
  Tier_Name: string;
  Amount: number;
}

export class BankResult {
  Id: number;
  Name: string;
  Group_Name: string;
  S_Id: number;
  S_Name: string;
  Class_ID: number;
  S_Class: string;
  Tier_Nbr: number;
  Tier_Name: string;
  Amount: number;
  Bank_Name: string;
  Bank_Id: number;
}

我要寻找的最终目标是,我可以在动态创建的多个材质选项卡上引用这些数据。希望看起来像这样:

<mat-tab-group>
<mat-tab *ngFor="let classresult of classresults "
label="S Class -  {{classresult._S_Class}}">
<table class ="responstable">
        <thead>
            <tr>
                <th>test</th>
                <th>test</th>
            </tr>
        </thead>
    <tbody>
        <tr *ngFor="let bankresult of finalarray.bankresults">
        <td>{{bankresult.S_Class}} </td>
        <td>{{bankresult.Tier_Name}} </td>
        </tr>
    </tbody>
    </table>
</mat-tab>
</mat-tab-group>

我还试图用switchMap实现这一点,但没能让它工作。

this.databaseService.getClass(id, this.selectedS, this.selectedTierNbr, this.selectedAmount).pipe(
    switchMap(classresults => {
      const bankrequests = classresults.map(
        classresult => this.databaseService
          .getBank(id, this.selectedS, this.selectedTierNbr, this.selectedAmount, this.selectedClassId)
          .pipe(map(bankresults => {classresult, bankresults}))
         );
         return forkJoin(bankrequests);
         console.log(bankrequests);
    })
  ).subscribe(results => this.results = results);

1 回复 | 直到 8 年前

1

Shreenil Patel 8 年前

这是因为可观测订阅的异步行为。

试试这个。

this.databaseService.getclass(id, this.selectedSeries, this.selectedTierNbr, this.selectedAmount)
.subscribe(
    (classresults) => {
        this.classresults = classresults;
        for (const classresult of this.classresults) {
            this.selectedClassId = classresult.Class_ID;
            console.log(this.selectedClassId);
            this.databaseService.getbank(id, this.selectedS, this.selectedTierNbr, this.selectedAmount, this.selectedClassId)
                .subscribe((bankresults) => {
                    this.bankresults = bankresults;
                    this.FinalArray.push(this.bankresults);
                    console.log(this.FinalArray);
                });
        }
    },
    (error) => {
        console.log('ERROR!')
    });