Extract Data Elements from API 2

Question

Extract Data Elements from API 2

Navigation

#1 by (2 votes)

0

The data of the two APIs comes in my console, the problem is that in the html in * ngFor it is only possible to scan the elements of the 1st subscribe that I store in dados , I would store the data of the 2 api's in order to use the data on the same screen, either in the same array or able to bring the array that I created in dados2 ..

Data List component

private dados: Dados[];
private dados2: DadosComp[];

constructor(
  private dadosService: DadosService,
  private http: Http)
  {   }

  getListarDados(){       
    this.dadosService.listarDados()
      .subscribe(
         dados => {this.dados = dados

         for(let i=0; i < this.dados.length; i++){
           let userId = this.dados[i].userId;

           if (userId != null){
               this.dadosService.listarDemaisDados(userId)
               .subscribe(
                   dados2 => {this.dados2 = dados2
                  //mostra todos os dados do 1ºsubcribe
                  console.log(this.dados)
                  //mostra todos os dados do 2ºsubscribe baseado no userId do 1º subscribe
                  console.log(this.dados2)
                   },
                   error => this.msgErro = error             
               );  
           }
           else{userId = 9999;}
        }                        
 },
        error => this.msgErro = error             
            );                                   
    }

data-service.ts

// -------------- conexão com 1ª API 
listarDados(): Observable<Dados[]>{
    return this.http.get(this.API_URL, null)
            .map(res => res.json(),
                //this.listarDemaisDados(idUser)
            )
            .catch(this.httpUtil.processarErros);                
}  

// -------------- conexão com 2ª API 
private path: number;
listarDemaisDados(userId: number): Observable<Dados[]>{

    //this.httpUtil.url(this.loginUrl), params, this.httpUtil.headers()
    //console.log(userId);
    this.path = userId;

    let API2_URL: string = 'linkdinamico/' + this.path;

    return this.http.get(API2_URL, this.httpUtil.headers())
        .map(res => res.json())
        .catch(this.httpUtil.processarErros);    
}

html

<tr *ngFor="let dado of dados; ">

        <td>{{ dado.serverDate }} {{ dado.serverTimePrettyFirstAction }}</td>
        <td>{{ dado.totalAbandonedCartsRevenue }}</td>
        <td>{{ dado.totalAbandonedCartsItems }}</td>
        <td>{{ dado.userId  }}</td>


        <!-- ESTES  SÃO OS CAMPOS QUE VEM BASEADOS DA 2ª API (dados2 - do component) e não consigo trazer -->
        <td>{{ dado.dsResponsibleName }}</td>

        <!-- ESTES SÃO OS CAMPOS QUE VEM BASEADOS DA 2ª API (dados2 - do component) e não consigo trazer -->
        <td>{{ dado.dsResponsibleName }}</td>
                <!--{{ dado.nuPhone }}</td -->
        <td>


                <button type="button" class="btn btn-danger" 
                    data-toggle="modal" data-target="#modalExcluir"
                    (click)="excluir(aluno.id)">
                    Ações
                </button>
            </td>
    </tr>

typescript angular

asked by anonymous 15.01.2018 / 14:17

1 answer

Problem in converting a query in vb.net to a procedure with varchar How to get the last position of an ID in the array

score 2 · Answer 1

I found my mistake! I was losing the object data ..

private dados: Dados[]; 
private dados2: DadosComp[]; 
private dados3: Array<Dados>=[];

Then I put inside my subscribe that lists the details ( dados2 ) the push command for the array that I created called dados3 to popular with the detail data I created with the data coming from dados2

and finally in the html I called through the detail, like this:

<tr *ngFor="let dado of dados3; let i = index;"> 
<td>{{ dado.serverDate }} {{ dado.serverTimePrettyFirstAction }}</td> 
<td>{{ dado.totalAbandonedCartsRevenue }}</td> 
<td>{{ dado.totalAbandonedCartsItems }}</td> 
<td>{{ dado.userId }}</td> 
<td>{{ dado.detail.dsResponsibleName }}</td> 
<td> ({{ dado.detail.nuPhoneDDD }}) {{ dado.detail.nuPhone }}</td> 
</tr>