typescript - RxJs-operator, forkJoin visar fel med mer än 6 parametrar i Angular 11

I mitt Angular-formulär har jag några egenskaper av samlingstyp. Egenskaperna ges nedan:

countries: CountryInfo[] = [];
floorLists: VariableInfo[] = [];
memberTypes: VariableInfo[] = [];
memberCategories: VariableInfo[] = [];
businessTypes: VariableInfo[] = [];
voterRelations: VariableInfo[] = [];
bloodGroups: VariableInfo[] = [];
designations: VariableInfo[] = [];

Nu har jag använt forkJoin-operatören för att anropa en tjänst för att fylla ovanstående egenskaper med data. Men det verkar som att närhelst jag sätter fler än 6 parametrar i forkJoin-operatören med olika typer, visar operatören ett fel. Nedan är koden

let countries$ = this.countryService.getCountryLists();
let floors$ = this.variableService.getFloorLists();
let memberTypes$ = this.variableService.getMemberTypeLists();
let categories$ = this.variableService.getMemberCategoryLists();
let businessTypes$ = this.variableService.getBusinessTypeLists();
let voterRelations$ = this.variableService.getVoterRelationLists();
let bloodGroups$ = this.variableService.getBloodGroupLists();
let designations$ = this.variableService.getDesignations();

forkJoin([countries$, floors$, memberTypes$, categories$, businessTypes$, voterRelations$, bloodGroups$, designations$]).subscribe(data => {
    this.countries = data[0];
    this.floorLists = data[1];
    this.memberTypes = data[2];
    this.memberCategories = data[3];
    this.businessTypes = data[4];
    this.voterRelations = data[5];
    this.bloodGroups = data[6];
    this.designations = data[7];
});

Det visar följande fel.

TS2322: Typen 'CountryInfo[] | VariableInfo[]' kan inte tilldelas typen 'CountryInfo[]'. Typen 'VariableInfo[]' kan inte tilldelas typen 'CountryInfo[]'. Typen 'VariableInfo' saknar följande egenskaper från typen 'CountryInfo': Name, Flag, Code

217 this.countries=data[0]; ~~~~~~~~~~~~~~

Svar #1

Jag tror att du kan uppnå det genom att använda en annan överlagring av forkJoin, eftersom den du använder kräver att objekten i observable-arrayen är av samma typ.

Följande överlagring bör fungera:

forkJoin({
  countries: countries$,
  floors: floors$,
  memberTypes: memberTypes$,
  categories: categories$,
  businessTypes: businessTypes$,
  voterRelations: voterRelations$,
  bloodGroups: bloodGroups$,
  designations: designations$,
}).subscribe((data) => {
  this.countries = data.countries;
  this.floorLists = data.floors;
  this.memberTypes = data.memberTypes;
  this.memberCategories = data.categories;
  this.businessTypes = data.businessTypes;
  this.voterRelations = data.voterRelations;
  this.bloodGroups = data.bloodGroups;
  this.designations = data.designations;
});

Svar #2

Detta beror på att data inuti subscribe() är av typen Array<CountryInfo[] | VariableInfo[]>. Så att referera till arrayen med indexet data[i] innebär typen CountryInfo[] | VariableInfo[], därav felet.

Du kan använda array-destrukturering för att få mer specifika typer, vilket bör fixa felet.

forkJoin([countries$, floors$, memberTypes$, categories$, businessTypes$, voterRelations$, bloodGroups$, designations$])
.subscribe(([countries, floors, memberTypes, categories, businessTypes, voterRelations, bloodGroups, designations]) => {
    this.countries = countries;
    this.floorLists = floors;
    this.memberTypes = memberTypes;
    this.memberCategories = categories;
    this.businessTypes = businessTypes;
    this.voterRelations = voterRelations;
    this.bloodGroups = bloodGroups;
    this.designations = designations;
});