Why am I getting TypeError on length property

Question

Getting this error:

TypeError: Cannot read property 'length' of undefined

For this code:

var getSuggestions = function(query) {
searchService.getSuggestions(query).then(function(es_return){
  var suggestions = es_return.suggest.phraseSuggestion;
  var results = es_return.hits.hits;

  if (suggestions.length > 0) {
    $scope.autocomplete.suggestions = suggestions;
  }
  else {
    $scope.autocomplete.suggestions = [];
  }

  if (results.length > 0) {
    $scope.autocomplete.results = results;
  }
  else {
    $scope.autocomplete.results = [];
  }

  if (suggestions.length > 0 || results.length > 0) {
    $scope.showAutocomplete = true;
  }
  else {
    $scope.showAutocomplete = false; 
  }
});

};

Specifically on the first if statement and I don't see why? Need some fresh eyes to show me what I'm doing wrong.

Answer 1

After I drilled down on this more, I noticed that I had an issue with the ES query that I was using for the ac code. It was actually just a typo. Where I had phrasesuggestion in the js, I had phrase_suggestion in the json query for ES, once I fixed that - it worked! Thanks for your efforts.

Answer 2

Try to debug the code from the developer console.

Probably you should es_return.hits.hits remake to es_return.hits.

In your case es_return.hits.hits or suggestions are not an array.

Answer 3

I think you need some better null handling. With Suggestion.length > 0 null cannot be evaluated with >, right? So probably use boolean instead (or both).

if (Suggestion.length){
   //do stuff
}

Answer 4

It looks like your es_return.suggest.phraseSuggestion is undefined.You can try like this:

if(suggestions != undefined)
{
if (suggestions.length > 0) {
    $scope.autocomplete.suggestions = suggestions;
  }
  else {
    $scope.autocomplete.suggestions = [];
  }
}