1

Tengo el siguiente código:

  listById (name: String): any[] {
    let elementElectrico: Array<any> = [];
    function getName(nameElect) {
    const elemetElec = [];
    const featureRequest2 = new WFS().writeGetFeature({
      srsName: 'EPSG:4326',
      featureTypes: ['neplan_postgreSQL:viewAllElements'],
      outputFormat: 'application/json',
      filter: equalToFilter('name', nameElect)
    });
    fetch('http://localhost:8080/geoserver/neplan_postgreSQL/wfs', {
      method: 'POST',
      body: new XMLSerializer().serializeToString(featureRequest2)
    }).then(function(response) {
      return response.json();
    }).then(function(json) {
      const features = new GeoJSON().readFeatures(json);
      elemetElec['name'] = features[0].values_.name;
      elemetElec['coordX'] = features[0].values_.geometry.flatCoordinates[0];
      elemetElec['coordY'] = features[0].values_.geometry.flatCoordinates[1];
      elemetElec['coords'] = features[0].values_.geometry.flatCoordinates;
    });
    return elemetElec;
  }
  elementElectrico = getName(name);
  return elementElectrico;
  }

y lo consumo en mi componente así:

cargarDatosByName(name: String): any[] {
  let lista: Array<any> = [];
  lista = this._service.listById(name);
  console.log(lista);
  return lista;
}

al imprimirlo en consola lo obtengo así:

resultado

 `[]
    coordX: -104.39924848
    coordY: 29.54486549
    coords: (2) [-104.39924848, 29.54486549]
    name: "2999"
    length: 0
      __proto__: Array(0)`

como accedo a sus propiedades, lo he intentado:

  1. console.log(lista[0].coordX);
  2. console.log(lista[0]);
  3. console.log(lista.coordX);

y no me deja acceder a las propiedades

5
  • Te doy la bienvenida a Stackoverflow. ¿Si quitas esta definición inicial: let lista: Array<any> = []; pasando a definir el elemento así: let lista = this._service.listById(name); qué se muestra en consola?
    – A. Cedano
    Commented el 14 dic. 2018 a las 21:37
  • Este código es de angularjs? Yo no veo nada que haga referencia a él en tu código
    – devconcept
    Commented el 14 dic. 2018 a las 21:37
  • @A. Cedano Al definirlo de esa manera, da el mismo resultado. Commented el 14 dic. 2018 a las 21:46
  • Ya, si estás usando angular entonces cedo el paso a alguien más que te podrá dar recomendaciones más precisas.
    – A. Cedano
    Commented el 14 dic. 2018 a las 21:48
  • Me confirmas por favor si utilizas angular o angular js? Commented el 14 dic. 2018 a las 21:55

2 respuestas 2

3

Estás creando un array de manera sincrónica y le estás asignando propiedades de manera asincrónica y por último accediendo a su valor de manera sincrónica. Eso te crea un race condition ya que como un arreglo es un objeto también asignarle propiedades no cambia la referencia original.

En su lugar debes intentar obtener el valor de manera asincrónica y luego manipular datos de manera sincrónica. Para eso retorna la promesa que crea el fetch en tu método listById y manipula el objeto o arreglo luego que las peticiones http terminen de ejecutarse. Yo cree un objeto porque no le vi caso a hacer un arreglo con el código de ejemplo que pusiste pero usar un arreglo con un objeto dentro es perfectamente posible.

listById(name: String): any[] {
  let elementElectrico: Array < any > ;

  function getName(nameElect) {
    const elemetElec = [];
    const featureRequest2 = new WFS().writeGetFeature({
      srsName: 'EPSG:4326',
      featureTypes: ['neplan_postgreSQL:viewAllElements'],
      outputFormat: 'application/json',
      filter: equalToFilter('name', nameElect)
    });
    return fetch('http://localhost:8080/geoserver/neplan_postgreSQL/wfs', {
      method: 'POST',
      body: new XMLSerializer().serializeToString(featureRequest2)
    }).then(function(response) {
      return response.json();
    }).then(function(json) {
      const features = new GeoJSON().readFeatures(json);
      return {
        name: features[0].values_.name,
        coordX: features[0].values_.geometry.flatCoordinates[0],
        coordY: features[0].values_.geometry.flatCoordinates[1],
        coords: features[0].values_.geometry.flatCoordinates
      };
    });
  }

  return getName(name);
}

Luego cuando quieras consumirlo

cargarDatosByName(name: String): any {
    let lista: Object = {};
    return this._service.listById(name).then(lista => {
        console.log(lista);
        return lista;
    });
}

Recuerda que, una vez que comiences trabajo asincrónico debes retornar promesas para que el trabajo que esté en curso pueda terminarse.

2
  • Gracias. Me salvaste, si me permite extraer la información. Commented el 17 dic. 2018 a las 18:55
  • @BryantCancino No olvides marcar la respuesta como aceptada si te sirvió.
    – devconcept
    Commented el 17 dic. 2018 a las 19:16
0

Debes devolver un objeto, no un vector. Esto es angular si mal no estoy, no angularjs, el tag lo tienes mal.

En la variable elemetElec, lo creas como array, pero asignas los valores como un objeto, a mi parecer el error radica ahí.

Intenta lo siguiente

  listById (name: String): any {
    let elementElectrico: Array<any> = [];
    function getName(nameElect) {
    let elemetElec:object = {};
    const featureRequest2 = new WFS().writeGetFeature({
      srsName: 'EPSG:4326',
      featureTypes: ['neplan_postgreSQL:viewAllElements'],
      outputFormat: 'application/json',
      filter: equalToFilter('name', nameElect)
    });
    fetch('http://localhost:8080/geoserver/neplan_postgreSQL/wfs', {
      method: 'POST',
      body: new XMLSerializer().serializeToString(featureRequest2)
    }).then(function(response) {
      return response.json();
    }).then(function(json) {
      const features = new GeoJSON().readFeatures(json);
      elemetElec['name'] = features[0].values_.name;
      elemetElec['coordX'] = features[0].values_.geometry.flatCoordinates[0];
      elemetElec['coordY'] = features[0].values_.geometry.flatCoordinates[1];
      elemetElec['coords'] = features[0].values_.geometry.flatCoordinates;
    });
    return elemetElec;
  }
  elementElectrico = getName(name);
  return elementElectrico;
  }

Tu componenete

cargarDatosByName(name: String): any {
  let lista: Object = {};
  lista = this._service.listById(name);
  console.log(lista);
  return lista;
}

Espero haberte ayudado. Cualquier duda me cuentas. ;)

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.