AngularJS, get data from external source and push into array

Question

I'm trying to call an external scrip that gets data from a database, so I can then populate a select dropdown. I've tried this so far, but I get a load of empty li elements. It is the right count of what there should be just nothing showing?

My controller

app.controller('agenciesController', function($scope, $http) {
  var url = "/ajax/getAgencies.php";

  $http.get(url).success( function(response) {
    $scope.agencies = response; 
    $scope.agenciesArray = [];
    angular.forEach(response, function(value, key){
      $scope.agenciesArray.push(value);
    })
    console.log($scope.agenciesArray);
  });
})

My HTML

<body ng-controller="Controller">
   <div ng-controller="agenciesController">
      <ul ng-repeat="agencyName in agencies">
        <li>{{agenciesArray.agencyID}}</li>
      </ul>
   </div>
</body>

UPDATE - This code is working but not returning only one response but all.

  <div ng-controller="agenciesController">
    <ul ng-repeat="agencyName in agenciesArray">
      <li>{{agencyName}}</li>
    </ul>
  </div>

agenciesArray is an array. agenciesArray.agencyID will be undefined. that is why you are gettting empty li. — Muthukannan Kanniappan
– Muthukannan Kanniappan, Commented Jun 22, 2016 at 10:47
Your ng-repeat loops on $scope.agencies but in the li you have agenciesArray.agencyID that I don't know what can be — rick
– rick, Commented Jun 22, 2016 at 10:50

Muthukannan Kanniappan · Accepted Answer · 2016-06-22 10:54:05Z

4

agenciesArray is an array. agenciesArray.agencyID will be undefined. that is why you are gettting empty li.

Do you intend to do this?

<ul ng-repeat="agency in agenciesArray">
        <li>{{agency.agencyName}}</li>
      </ul>

edited Jun 22, 2016 at 10:54

answered Jun 22, 2016 at 10:49

Muthukannan Kanniappan

2,0791 gold badge16 silver badges18 bronze badges

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

5 Comments

Kieron606 Over a year ago

This is bringing stuff back but not just agencyName by its self check edit.

rick Over a year ago

good one you have to check for the attribute agencyName in the object that you called agencyName in th eng-repeat

Kieron606 Over a year ago

@rick so basically in ng-repeat it's like assigning a variable to agenciesArray

Kieron606 Over a year ago

Just another question, how can I put these as <select> options instead of in a ul?

rick Over a year ago

The syntax is "iterator in list"

Hassan Tariq · Accepted Answer · 2016-06-22 10:48:37Z

0

Try this

<ul ng-repeat="agencyName in agencies">
    <li>{{agencyName.agencyID}}</li>
  </ul>

Reason:Because agencyArray is nothing in the given context

answered Jun 22, 2016 at 10:48

Hassan Tariq

7407 silver badges15 bronze badges

Collectives™ on Stack Overflow

AngularJS, get data from external source and push into array

2 Answers 2

5 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

5 Comments

Comments

Your Answer

Sign up or log in

Post as a guest