如何修复打字稿中的二维数组的映射

Question

我正在使用角。以下是Typescript和HTML代码。在打字稿代码中，line this.selectedPartyCandidate = this.mappedsenatecandidates.map（_ =＆gt; 0）; //有问题有错误。但是它与单维数组的工作正常：this.selectedPartyArray = this.parties.map（_ =＆gt; 0）; //工作。如何解决此多维阵列问题？

错误：类型'number []'不能分配给类型'number [] []'。 键入“数字”不能分配给'number []'。

.ts文件

 interface Candidate {
      id?: Number,
      name: string,
      party: string,
      preferences: Array<Number>
    }
    interface Party {
      party: String,
      preferences: Array<Number>
    }
    
    interface SenateCandidate {
      id: Number,
      attributes: senateCandidateAttributes
    }
    
    interface senateCandidateAttributes {
     
      updatedAt: String
    }
    
    interface mappedSentateCandidate {
      party: String
      candidates: Array<String>
    }
     
    
        constructor() {
            this.selectedPartyArray = this.parties.map(_ => 0); //working
            this.selectedPartyCandidate = this.mappedSenateCandidates.map(_ => 0); //has issues
          }
        
          selectedPartyArray: number[] = [];
          selectedPartyCandidate: number[][] = [];

.html文件

<div *ngFor="let party of parties; index as index">
  <div class="column">
    <mat-form-field appearance="fill" style="max-width: 50px">
      <mat-label></mat-label>
      <mat-select (selectionChange)="preferenceChange($event, party)"  [(ngModel)]="selectedPartyArray[index]" name="preference">
        <mat-option
        *ngFor="let preference of party.preferences" 
        [value]="preference"
        >
        {{preference}}
        </mat-option>
      </mat-select>
    </mat-form-field>
  </div>
  <div class="column"></div>
  <div class="column">
    {{ party.party }}
  </div>
</div>

<p>
  <!-- Submit button -->
  <button mat-raised-button (click)="submit()">Submit</button>
</p>

<div class="flex-container">
  <div *ngFor="let mappedSenateCandidate of mappedSenateCandidates; index as index">
    <!-- <div class="column" *ngFor="let i = 1; i <= mappedSenateCandidate.length; i++">
      {{`${mappedSenateCandidate}_${i}`}}
    </div> -->
    <div>
      <div><b>{{mappedSenateCandidate.party}}</b></div>
      <div class="inner-flex-container" *ngFor="let candidate of mappedSenateCandidate.candidates; index as index1">
        <mat-form-field appearance="fill" style="max-width: 50px">
          <mat-select [(ngModel)]="selectedPartyCandidate[index][index1]" name="preference">
            <mat-option
              *ngFor="let preference of senateCandidatePrefereneList"
              [value]="preference"
              >{{ preference }}
            </mat-option>
          </mat-select>
        </mat-form-field>
        {{candidate}}
        <div></div>
      </div>
    </div>
  </div>
</div>

Answer 1

this.selectedPartyCandidate = this.mappedSenateCandidates.map(_ => 0);

this.mappedsenatecandidates.map（_ =＆gt; 0）将创建数字数组，但是this.selectedPartyCandidate期望有一系列数组，因此您无法分配一个数字数量。 要分配一个空数组

this.selectedPartyCandidate = this.mappedSenateCandidates.map(_ => []);

如果

this.selectedPartyCandidate = this.mappedSenateCandidates.map(_ => [0]);

数组然后执行此操作：

this.selectedPartyCandidate = this.mappedSenateCandidates.map(
  subArray => subArray.map(_ => 0)
);

---

或者，如果您确实想要一个数字数组，请更改此类型。

selectedPartyCandidate: number[] = [];