AngularJS - how to set Select value based on specific JSON property?

Question

I am beginner in AngularJS and I am having problems with setting the selected value of the ng-model of a Select.

Here is my data structure:

[{"ID":0,"Name":"G"},{"ID":1,"Name":"PG"}]

Here is my HTML:

<div class="col-md-8" ng-init="GetAllRatings()">
      <select ng-model="InputMovieRating" ng-options="rating.Name for rating in ratings"></select>
</div>

And I want to do this:

$scope.InputMovieRating = 'PG';

But it is not working. What I found that worked is to iterate through the ratings, and something like this:

    var selectedRating = $scope.ratings[0]; //default
    for (var i = 0; i < $scope.ratings.length; i++)
    {
        if($scope.ratings[i].Name == 'PG')
        {
            selectedRating = $scope.ratings[i];
        }
    }
    $scope.InputMovieRating = selectedRating;

That one works but I am thinking that it might be an incorrect way, and I am just doing something wrong with binding of ng-options.

NTP · Accepted Answer · 2018-09-29 05:59:48Z

1

try the following

<div class="col-md-8" ng-init="GetAllRatings()">
  <select ng-model="InputMovieRating" ng-options="rating.Name as rating.Name for rating in ratings"></select>
</div>

if you have asynchronous data loading set the value of model

  $scope.InputMovieRating = "PG";

after data load is complete.

Demo

answered Sep 29, 2018 at 5:59

NTP

4,4483 gold badges18 silver badges25 bronze badges

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

Comments

Linoy · Accepted Answer · 2018-09-29 05:30:41Z

0

Might be you missed to assign an object to the property .What you added is just a value (PG)

$scope.InputMovieRating = {"ID":1,"Name":"PG"}

answered Sep 29, 2018 at 5:30

Linoy

1,4151 gold badge20 silver badges30 bronze badges

1 Comment

Water Over a year ago

Yes, just the 'PG' is intended. This is because the 'PG' itself comes from a different place. I just wrote it simply for easier explanation.

Collectives™ on Stack Overflow

AngularJS - how to set Select value based on specific JSON property?

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related