AngularJS DropDown with ng-options

Question

Let's say I have a Controller like such:

function MockController($scope) {
$scope.objs = [{"a": "true"},{"b": "false"}];
$scope.Value = "";
}

In the html view I'd have something like:

  <select class="input-block-level" ng-model="Value" 
  ng-options="(obj.key, obj.value) for obj in objs" required>

However, no matter how I try, angular doesn't seem to like the tuple notation. I tried without parenths and no dice. Is there a generic way to treat hashtables/dictionaries in ng-repeat? That is, assume you don't know the name of the key and they key itself should be used like such:

<option value={{obj.key}}>{{obj.value}}</option>

Community · Accepted Answer · 2017-05-23 12:29:18Z

5

I don't think it's possible to refer to unknown keys in ng-options.

I'd probably try to write a wrapper for the data somewhere along the way, converting it into something like:

[{"key": "a", "value": "true"},
 {"key": "b", "value": "false"}]

(The problem was so interesting that I actually wrote one already: http://jsfiddle.net/RCU8M/ - but that won't work in browsers without ECMAScript5 support, so you might want to fix that by using a more elegant solution, like in get keys of json-object in JavaScript .)

edited May 23, 2017 at 12:29

CommunityBot

11 silver badge

answered Apr 10, 2013 at 8:16

MJV

1,8822 gold badges26 silver badges38 bronze badges

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

Comments

akonsu · Accepted Answer · 2013-04-10 02:37:05Z

2

is it not

<select ... ng-options="(key, value) in objs" ...>

answered Apr 10, 2013 at 2:37

akonsu

29.7k39 gold badges126 silver badges204 bronze badges

1 Comment

rdodev Over a year ago

Let me try this. I"ll report back.

user2107373 · Accepted Answer · 2013-10-30 08:47:09Z

1

This should be used like this:

<select>
<option ng-repeat="objin objs" value="{{obj.key}}">{{obj.value}}</option>
</select>

answered Oct 30, 2013 at 8:47

user2107373

4374 silver badges17 bronze badges

Collectives™ on Stack Overflow

AngularJS DropDown with ng-options

3 Answers 3

Comments

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Related