I would like to create a drop-down list and retrieve the elements from a webService.
My problem is that I would like to avoid displaying duplicate items because I have 9999 items.
Here is the JSON file.
Do you think it is possible to do this? Because, I have no idea how to program this?
The display method is this:
private getDropDownList(): void {
this.service.getDropDownList().pipe(
takeUntil(this.unsubscribe$)
).subscribe(res => {
if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
this.corporateLines = res.TITRE.map(
corporateLine => {
return {
placelabel: corporateLine.PLACELABEL,
}
}
);
}
});
}
corporate.component.ts
export class CorporateComponent implements OnInit, OnDestroy {
private unsubscribe$ = new Subject<void>();
corporateLines: Corporate[] = [];
constructor(private service: CorporateService, private router: Router) { }
ngOnInit(): void {
this.getDropDownList();
}
ngOnDestroy(): void {
this.unsubscribe$.next();
this.unsubscribe$.complete();
}
private getDropDownList(): void {
this.service.getDropDownList().pipe(
takeUntil(this.unsubscribe$)
).subscribe(res => {
if (res.RETURNCODE === ApiResponseCodeEnum.Ok) {
this.corporateLines = res.TITRE.map(
corporateLine => {
return {
placelabel: corporateLine.PLACELABEL,
}
}
);
}
});
}
}
corporate.response.ts
import { ApiResponse } from "src/shared/types/api.response";
export interface CorporateResponse extends ApiResponse {
TITRE: {
PLACELABEL: string;
}[];
}
corporate.ts
export interface Corporate {
placelabel: string;
}
corporate.component.html
<div class="row row-cols-3 pt-3">
<div class="col text-end">
<label for="filterForMarkets" class="form-label">Label</label>
</div>
<div class="col-4">
<select>
<option *ngFor="let line of corporateLines"></option>
</select>
</div>
</div>
Thanks
Via Active questions tagged javascript - Stack Overflow https://ift.tt/dP1g9bT
Comments
Post a Comment