Angular2 + Elasticsearch: Getting "property of undefined" error when computing retrieved JSON data from Elasticsearch server

Question

My goal is to retrieve sample data from a running local ElasticSearch Server inside my NG2-webapp, and then display those results.

So far, I have created a component test-es-types using the NPM Elasticsearch Typescript package.

This is the .ts code:

  import { Component, OnInit } from '@angular/core';
  import * as elasticsearch from 'elasticsearch';

  @Component({
    selector: 'app-test-es-types',
    templateUrl: './test-es-types.component.html',
    styleUrls: ['./test-es-types.component.scss']
  })

  export class TestEsTypesComponent implements OnInit {

    constructor() { }

    ngOnInit() {

   // Setting up Elasticsearch Client
   var client = new elasticsearch.Client({
     host: 'http://localhost:9200',
     log: 'trace'
   });

   console.log("Client:", client);

  // Elasticsearch Server Ping
  client.ping({
  // ping usually has a 3000ms timeout
  requestTimeout: 1000
}, function (error) {
  if (error) {
    console.trace('elasticsearch cluster is down!');
  } else {
    console.log('All is well');
  }
});

// first we do a search, and specify a scroll timeout
var allTitles: string[] = [];
console.log("Erzeuge allTitles Array...");
client.search({
  index: 'bank',
  // Set to 30 seconds because we are calling right back
  scroll: '30s',
  searchType: 'query_then_fetch',
  docvalueFields: [''],
  q: 'Avenue'
}, function getMoreUntilDone(error, response) {
  // collect the first name from each response
  console.log("allTitles gefüllt: ", allTitles);
  response.hits.hits.forEach(function (hit) {
    allTitles.push(hit.fields.firstname);
  });

  if (response.hits.total !== allTitles.length) {
    // now we can call scroll over and over
    client.scroll({
      scrollId: response._scroll_id,
      scroll: '30s'
    }, getMoreUntilDone);
  } else {
    console.log('every "test" title', allTitles);
  }
});

}

}

ES-server is running on localhost:9200 and returns the queried data as expected (according to console). However, when trying to put this data into an array (allTitles), I get the following console error:

Uncaught TypeError: Cannot read property 'firstname' of undefined

console.log tells me that allTitles is empty (length 0), so that obviously doesn't work. Seems like I do not yet understand the intricacies of transforming objects into arrays?

I suggest you to read some about separation of concerns, as your component is involved in way to many and different concerns — Jota.Toledo
– Jota.Toledo, Commented Jul 18, 2017 at 17:44

Ali · Accepted Answer · 2020-02-10 23:45:01Z

1

Its highly discouraged not to use elastic APIs directly from a browser environment.

https://github.com/elastic/elasticsearch-js/issues/905#issuecomment-582932779

answered Feb 10, 2020 at 23:45

Ali

112 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ndon · Accepted Answer · 2017-07-18 19:26:05Z

0

One possible issue is that you aren't accessing the response properly. Try something like

client.search({......
.............
.............
}).then(function(resp){
      console.log("allTitles gefüllt: ", allTitles);
      response.hits.hits.forEach(function(hit){
          allTitles.push(hit.fields.firstname);
      });
}, function(err){
      console.log(err);
});

Here is the quickstart guide for more information.

answered Jul 18, 2017 at 19:26

ndon

13 bronze badges

Collectives™ on Stack Overflow

Angular2 + Elasticsearch: Getting "property of undefined" error when computing retrieved JSON data from Elasticsearch server

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related