0

Recojo un listado de Personas que es un Array en JSON y lo meto en un this que a su vez lo guardo en un that para que sea accesible.

El problema es que al pasarle el that a otra clase no puedo acceder al Array de personas que guardé.

import { Component, OnInit,Input } from '@angular/core';

import { ActivatedRoute } from '@angular/router';

import { Person } from '../class/personClass';
import { ConexionPersonService } from '../conexion-person.service';

@Component({
    selector: 'app-detail-user',
    templateUrl: './detail-user.component.html',
    styleUrls: ['./detail-user.component.css']
})
export class DetailUserComponent implements OnInit {

    detailPerson: Person;
    People:Person[];
    @Input() id;
    that;

    constructor(
        private route: ActivatedRoute,
        private conexion: ConexionPersonService) { }

    ngOnInit() {
        this.id = +this.route.snapshot.paramMap.get('id');
        this.getPeople(); 
        this.getPerson();
    }

    getPeople(): void { 
        this.that = this;
        this.conexion.getPeople()
            .subscribe(People => this.that.People = People);
    }

    getPerson(): void { 
         this.detailPerson = this.conexion.getPerson(this.that,this.id); 
     } 
}

import { Injectable } from '@angular/core';

import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable } from 'rxjs/Observable';
import { catchError, map, tap } from 'rxjs/operators';

import { of } from 'rxjs/observable/of';
import { Person } from './Class/personClass';

@Injectable()
export class ConexionPersonService {

    person : Person;

    constructor(
        private http: HttpClient,
    ) { }

    public getPeople(): Observable<Person[]> {

        const url = 'assets/Json/listPerson.json';
        //console.log('llego');

        return this.http.get<Person[]>(url)
            .pipe(
                //tap(heroes => this.log(`fetched heroes`)),
                catchError(this.handleError('getPosts', []))
            );
    }

    public getPerson(People:Person[] , id:number): Person{

        //console.log( "dentro de conexion array" , People);
        //console.log( "dentro de conexion id" , id);
        console.log("En conexion" , People);
        for (var i = 0 ; i < People.length; i++){
            if(People[i].id_user == id ){
                this.person = People[i];
            }
        } 
        console.log("array" , this.person);
        return  this.person;
    }


    /**
      * Handle Http operation that failed.
      * Let the app continue.
      * @param operation - name of the operation that failed
      * @param result - optional value to return as the observable result
      */
    private handleError<T>(operation = 'operation', result?: T) {
        return (error: any): Observable<T> => {
            // TODO: send the error to remote logging infrastructure
            console.error(error); // log to console instead 
            // Let the app keep running by returning an empty result.
            return of(result as T);
        };
    }
}

introducir la descripción de la imagen aquí

Lápiz rojo : El log de la clase conexión:

Lápiz azul: se puede ver como hay un Array de 6 elementos y al mismo tiempo hay un People:undefined cosa que entiendo que la variable People que llevo en DetailUserComponent nunca se le asigna un valor.

También se puede ver que traigo los otros objetos de la clase DetailUserComponent

Lápiz negro : Es un bucle infinito, un that que contiene DetailUserComponent que contiene un that ....

Problema : Quiero Poder recorrer ese array y devolver el objeto cuyo id_user me devuelvan, pero no hay manera ....

3
  • ¿ésta no es la pregunta que has hecho antes? Y no necesitas ese atributo that... el 10 abr. 2018 a las 16:15
  • no, esto es que en la clase ConexionPersonService no puedo obtener el valor o no sé obtener el valor, de un array de 6 'lápiz azul '
    – EduBw
    el 11 abr. 2018 a las 6:08
  • Ahora mira mi respuesta a tu otra pregunta y prueba el código: no puedes llamar en tu componente a getPerson hasta que obtengas la respuesta de getPeople. Si los llamas en paralelo tienes una race condition el 11 abr. 2018 a las 8:08

2 respuestas 2

1

2 cosas en tu codigo:

1- veo que estas haciendo this.that.People = People o sea guardando el Person[] dentro de una propiedad llamada People en el objeto that y luego haces this.conexion.getPerson(this.that,this.id); que le pasas a getPerson el objeto that, pero getPerson recibe un Person[] y no un objeto con una propiedad People de tipo Person[]

La idea aqui es que guardes directamente en that el Person[] de manera que te quede asi

this.that = People

2- Lo segundo es que estas llamando el getPerson antes de haber obtenido la lista de Personas del servicio, debes de llamarlo de este modo

ngOnInit() {
        this.id = +this.route.snapshot.paramMap.get('id');
        this.getPeople();
    }

    getPeople(): void { 
        this.that = this;
        this.conexion.getPeople()
            .subscribe(People => {
               this.that = People;
               getPerson();
        });

    }
1

No declares that

detailPerson: Person;
People:Person[];
@Input() id;
that;

Y no lo asignes a this.

this.that = this;

En lugar de eso usa

var that = this;

Entonces envía solamente that a las demás funciones

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.