#angular #typescript #foreach #rxjs
#angular #typescript #foreach #rxjs
Вопрос:
Я новичок в angular и rxjs, я хочу разрешать company name
из company id
в массиве.
У меня есть данные компании в этом формате:
|---------------------|------------------|
| CompanyID | CompanyName |
|---------------------|------------------|
| 1234 | CompanyA |
|---------------------|------------------|
| 5678 | CompanyB |
|---------------------|------------------|
И мои угловые коды:
let items = [];
let companyIDs = [1234, 5678];
companyIDs.forEach(companyID => {
this.items.push({
compId: companyID,
compName: ??? <------- how to resolve the name from the companyID above?
})
});
У меня есть сервис, который возвращает RXJS observable
, который позволяет мне разрешать company name
this.companyService.getCompanyName(1234).subscribe((companyName) => {
//return CompanyA
})
Как я могу использовать companyService
для разрешения названия компании?
Редактировать: Я знаю, что в цикле будет много запросов, вызывающих this.companyService.getCompanyName()
, любые другие предложения, такие как использование this.companyService.getCompanies()
вместо этого, приветствуются.
Ответ №1:
Это слишком много http-запросов, если вы повторяете свои ID и получаете CompanyID для каждого. Тем не менее, это то, что вы можете сделать, чтобы ваш конкретный случай заработал:
companyIDs.forEach(companyId => {
this.companyService.getCompanyName(companyId)
.subscribe(compName => this.items.push({
compId: companyId, compName: compName
})
});
проблема с этим подходом заключается в том, что вам приходится выполнять запрос на обслуживание за итерацию, что означает, что массив из 100 идентификаторов будет соответствовать 100 http-запросам, что далеко не идеально….
Если у вас есть возможность создать httpCall, который предоставит вам всю таблицу идентификаторов и названий компаний в таблице, как показано в вашем вопросе… например, this.service.getAllCompanies() // return all the company objects with { id, name }
, тогда вы могли бы выполнить этот вызов, а затем выполнить итерацию по результату, превратив его в простой http-запрос.
Комментарии:
1. Другая потенциальная проблема заключается в том, что порядок элементов в массиве отличается от первоначального порядка идентификаторов.
2. @Francisco да, действительно, подумайте об этом, все еще выясняя, как использовать
this.service.getAllCompanies()
для сопоставления идентификаторов и возврата имени3. если у вас есть способ вызвать все элементы.. подпишитесь на него и преобразуйте результат в переменную или используйте канал map, чтобы изменить структуру ответа сервиса (смотрите Каналы rjxs и, в частности, map, чтобы узнать магию этого подхода), если у вас есть еще вопросы, задавайте!
Ответ №2:
вы можете сделать так
items = [];
companyIDs = [1234, 5678];
FillItems(){
for(let i=0; i<this.companyIDs.length;i ){
this.getcompanyname(this.companyIDs[i]);
}
}
getcompanyname(companyid:number){
this.companyService.getCompanyName(companyid).subscribe((companyName) => {
this.items.push({
compId: companyid,
compName:companyName
})
}