unable to query java script array in angularjs

Question

Hi I am developing web application in angularjs. I am trying to query array in angularjs. Below is my code snippet.

var angulararray = [];
bindleaselistings.bindleaselistingsmethod().then(function(response) {
  angular.forEach(response.data.data.LeaseList, function(value, key) {
    angulararray.push(value);
  });
}, function(error) {});
console.log(angulararray);
debugger;
var found = $filter('filter')(angulararray, {
  id: accountnumber
}, true);
if (found.length) {
  $scope.selected = JSON.stringify(found[0]);
} else {
  $scope.selected = 'Not found';
}

console.log displays required array. I have attached screenshot.

When i debug the var found = $filter('filter')(angulararray, { id: accountnumber }, true); I can see angulararray is empty. May I know am I doing anything wrong in above code? Any help would be appreciated. Thank you

If the account number is the variable you want to filter by, it should look like this: `var found = $filter('filter')(angulararray, accountnumber, true);` — JSON Derulo, Aug 10 '17 at 11:57
The problem is in misunderstanding of asynchronous operations in JS — MysterX, Aug 10 '17 at 11:57
Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) — Yury Tarabanko, Aug 10 '17 at 11:57
Thank you all. Whenever i debug angulararray is not containing any elements but in console it is displaying array. I am struggling to find out the issue — Niranjan Godbole, Aug 10 '17 at 12:00

Vivz · Accepted Answer · 2017-08-10T12:17:03.030

2

The problem is with asynchronous execution of your code.The execution of your API call and the code below it, will be executed in parallel. The value of angulararray is empty outside the API call. You can move your filtering inside the success callback of your API.

var angulararray = [];
bindleaselistings.bindleaselistingsmethod().then(function(response) {
    angular.forEach(response.data.data.LeaseList, function(value, key) {
        angulararray.push(value);
    });
var found = $filter('filter')(angulararray, {
    id: accountnumber
}, true);
}, function(error) {});
console.log(angulararray);

if (found.length) {
    $scope.selected = JSON.stringify(found[0]);
} else {
    $scope.selected = 'Not found';
}

edited Aug 10 '17 at 12:17

answered Aug 10 '17 at 12:10

Vivz

6,625
2
17
33

Thanks Vivz. I have updated screenshot. I am not able to match accountNumber eventhough accounnumber exist in array. – Niranjan Godbole Aug 10 '17 at 12:19
1

I think you should use accountNumber inside the filter – Vivz Aug 10 '17 at 12:26

Tim · Answer 2 · 2017-08-10T12:47:00.353

You're having an async problem. Your code needs to be run after the promise is resolved.

The reason you get the response in the console.log is because your tools show a live view of the variable. So once the variable is resolved the view in the console will change to the result of the resolved promise.

var angulararray = [];
bindleaselistings.bindleaselistingsmethod().then(function (response) {
    angular.forEach(response.data.data.LeaseList, function (value, key) {
        angulararray.push(value);
    });
    console.log(angulararray);
    debugger;
    var found = $filter('filter')(angulararray, {
        id: accountnumber
    }, true);
    if (found.length) {
        $scope.selected = JSON.stringify(found[0]);
    } else {
        $scope.selected = 'Not found';
    }
}, function (error) { });

score 0 · Answer 3 · answered Aug 10 '17 at 12:16

you could change the way u filter ur variable and have something like this:

 var found;
 var len = angulararray.length;
 for(var i=0; i<angulararray; i++){
  if(typeof angulararray[i]['AccountNumber'] === 'undefined') {
    $scope.selected = 'Not found';
  }
  else {
  found = angulararray[i];
  $scope.selected = JSON.stringify(found[0]);
  }
 }

unable to query java script array in angularjs

3 Answers3