Angular разрешает название компании из идентификатора компании в цикле

#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
          })
      }