Angular JS : ng-option add "string:" prefix int the option value

Question

Below is my select with ng-options:

<select ng-options="key as value for (key , value) in getList() ..."> </select>

The getList() function retrieves the following object:

{"CURRENT_ACCOUNT":"test1","ORDINARY_ACCOUNT":"test2"}

and if I inspect the generated options, it is the following:

<option label="test1" value="string:CURRENT_ACCOUNT" selected="selected">test1</option>

As you can see, everything seems right except the value attribute has a string: prefix.

How can I remove the prefix? What did I do wrong?

Hello! Do you mean "AngularJS" or "Angular"? AngularJS refers to versions 1.x and lower, and Angular refers to versions 2+. — user10747134
– user10747134, Commented Feb 13, 2019 at 18:06
Looking at the html markup provided for the select, i'm fairly certain this is AngularJS, as ng-options isn't valid in Angular (v2+). But good question and lets get the tags updated properly. — Michael Lynch
– Michael Lynch, Commented Feb 13, 2019 at 18:18

Michael Lynch · Accepted Answer · 2019-02-13 18:10:40Z

2

You didn't do anything wrong and your code is actually correct. This is how AngularJS creates the options.

<select ng-model="selected" ng-options="key as value for (key, value) in getList()"></select>
Selected: {{selected}}

If you print out the value of the selected item immediately following it, you'll noticed that the value is just CURRENT_ACCOUNT and not string:CURRENT_ACCOUNT as the option leads you to believe.

Here is a plunker demonstrating it.

https://next.plnkr.co/edit/lvEi6pknJZMh0wab?open=lib%2Fscript.js&deferRun=1

answered Feb 13, 2019 at 18:10

Michael Lynch

1,73315 silver badges28 bronze badges

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

5 Comments

SWeC Over a year ago

yes, this is right, printing the variable there are not any problem. the issue is caused by the form that is submitted and the "string:" prefix remain in the attribute value. is there any way to escape to haver this prefix?

Michael Lynch Over a year ago

So you're submitting the form via the html? You should instead be doing that using Angular to handle your form submissions via ajax requests (see $http.post(...)).

SWeC Over a year ago

I'm doing the $http.put(... but the value come to the server with "string:" . any idea?

Michael Lynch Over a year ago

How are you serializing the form data to be sent to the server? Let me update the plunker with a little bit more code to demonstrate how to do so. Should just be grabbing the object from angular.

SWeC Over a year ago

Issue was related to another JS function that is used to prepare the form in case of kana characters. Thank you very much for helping!

Collectives™ on Stack Overflow

Angular JS : ng-option add "string:" prefix int the option value

1 Answer 1

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related