I'm using ui-select2
in my angular project.
My model downloads a complex object called Field
which has multiple properties in it(a Field
has a title\value and other things).
Now to be specific, my Field
has two relevant properties Value
and Options
.
Options
is a key value array object which contains Value
and Text
. It's specific for a select-box.
The Text
property is a string value(display) where the Value
property is usually a Number, but can be a string.
Bottom line, my select2 template looks something like this:
<select ui-select2="select2Options" ng-model="model">
<option ng-repeat="option in options" value="{{option.Value}}">{{option.Text}}</option>
</select>
Pretty trivial..
My problem is that the ng-model converts the selected option's Value
into a string(e.g. 2 -> "2") and by doing that, I get problems with the selected value after it returns from the server(since 2 !== "2").
I've debugged deep into the sources and couldn't find a good work around.
I tried using ng-options
this way:
<select ui-select2="select2Options" ng-model="model" ng-options="opt.Text for opt in options">
<option value=""></option>
</select>
But then my model
got the key-value object.
Now I can think of an ugly work around by adding a dummy ng-model property and adding a watch on the scope which will assign the Value
to the "real" model - but I don't want to do that.
Does anyone have any advice for me?