0

I am trying to populate States in Select with ng-options. As i am new to angular, result doesn't come as expected.

Controller

$scope.statesList = function () {
        StatesList.query(function (states) {
            $scope.states = states;            
        });
    };

Html

<td data-ng-init="statesList()">
    <select ng-model="practiceAdd.state" name="state{{$index+1}}" ng-class="{'has-error': editForm.{{$index+1}}.$invalid}" 
        ng-options="state in states" required>
    </select>                                                                
</td>

Array

$$hashKey: "05S"
_id: "53107e099d985dc404000015"
city: "mumbai"
country: "india"
state: "AR"
street: "1"
zipcode: 42101
Anup
  • 9,396
  • 16
  • 74
  • 138
  • please post `$scope.states` array to help us to solve it. – Maxim Shoustin Mar 01 '14 at 08:04
  • Hi Check few url: http://docs.angularjs.org/api/ng/directive/select http://stackoverflow.com/questions/12139152/how-to-set-value-property-in-angularjs-ng-options http://stackoverflow.com/questions/13047923/working-with-ng-options-in-angular – JQuery Guru Mar 01 '14 at 08:11
  • @MaximShoustin I posted the Array.. – Anup Mar 01 '14 at 08:33

1 Answers1

1

Try like This..

In HTML

<select name="countries" id="countries" ng-model="countryCode" ng-options="country.code as country.name for country in countries"></select>

In angular JS Code

  $scope.countries = [
    {
      name: 'Poland',
      code: 'PL'
    },
    {
      name: 'United Kingdom',
      code: 'UK'
    },
    {
      name: 'United States of America',
      code: 'USA'
    }
  ];
  $scope.countryCode = 'UK';

Working Exaple

In your Example ;

<td>
    <select ng-model="state.Id" name="state{{$index+1}}" ng-options="state.Id as state.name for state in states" required>
    </select>                                                                
</td>

State id and state name should be defined by you.

Krishan
  • 2,356
  • 6
  • 36
  • 47