Why the Angular ng-options value contains the value data type?

Question

Guys after I used the angular directive ng-options I got this result

<select name="users" id="users" ng-options="user.id as user.name for user in users" ng-model="user">
    <option value="number:1" label="Developers">Ahmed</option>
    <option value="number:2" label="Designers">Jon</option>
    <option value="number:3" label="HR">Astm</option>
    <option value="number:4" label="Doctor">Fady</option>
</select>


<select name="colors" id="colors" ng-options="color.code as color.name for color in colors" ng-model="color">
    <option value="string:ff0000" label="Developers">Red</option>
    <option value="string:ffffff" label="Designers">White</option>
    <option value="string:000000" label="HR">Black</option>
</select>

why the option value contains the data type such as number:1 or string:ffffff ??

how I can remove the data type from it and keeping only the value ?

Why do you care? You shouldn't mess with the DOM anyway. What matters is what your model (i.e. $scope.user and $scope.color) contains — JB Nizet, Aug 16 '15 at 13:21
I'm reading it from Json array like [ { "id": 1, "name": "Ahmed" }, { "id": 2, "name": "Jon" } ] — Astm, Aug 16 '15 at 13:29

score 5 · Answer 1 · answered Feb 06 '17 at 12:11

5

Add track by [id] at the end of ng-options.

In your case it would be:

ng-options="user.id as user.name for user in users track by user.id"

and

ng-options="color.code as color.name for color in colors track by color.code"

answered Feb 06 '17 at 12:11

Davor

739
10
14

score 0 · Answer 2 · answered Aug 16 '15 at 13:40

0

Right now there is not option in angular to remove that type. If you need that, use custom directive with ng-option as parent.

answered Aug 16 '15 at 13:40

Gopi

163
1
13

can you send to me example please :) – Astm Aug 16 '15 at 14:14
May i know why u need that option, Is it must or not?? – Gopi Sep 08 '15 at 17:18

Why the Angular ng-options value contains the value data type?

2 Answers2