AngularJS select value of property instead of object

Question

I want to bind ng-model with string value of a property not with the complete object. http://jsfiddle.net/arkomahmud/753YB/2/

My HTML code looks as follows

<div ng-app='myApp' ng-controller="ArrayController">
    <select ng-model="group.name" ng-options="Group.Name for Group in Groups"></select>
    <div class="col-md-4" ng-show="group.name.Value == 'new'">
        <input class="text-box" type="text" name="NewValue" ng-model="newValue" />
        <button ng-click="add(newValue)">Add</button>
    </div>
      <p>Here I want Value Only[Not object]: {{group.name}}</p>
    <p>Now I get it in this way: {{group.name.Name}}</p>
    <p><b>But I want group.name to be string not object</b></p>
</div>

meze · Accepted Answer · 2014-07-17 14:43:49Z

2

You can do:

 <select ng-model="group.name" ng-options="Group.Name as Group.Name for Group in Groups">

But that will break the condition on group.name.Value.

answered Jul 17, 2014 at 14:43

meze

15.1k4 gold badges49 silver badges53 bronze badges

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

3 Comments

Muffin Over a year ago

Thanks this is what I wanted. Somehow misunderstood the documentation :D

meze Over a year ago

@Muffin sylwester's answer is probably what you want ;)

Muffin Over a year ago

Nope :D, I wanted to group.Name to a string and value of Groups coming from a Database table where many other things are stored. I just excluded them from example. My Real array of object is something like [{"Types": "Group", "Name": "GroupA"},{{"Types": "Group", "Name": "GroupB"}}]. In this way I am saving all dropdown options in single table. But I am not sure if it is optimal.

sylwester · Accepted Answer · 2014-07-17 14:48:56Z

2

http://jsfiddle.net/zq53z/ group.Name is a string as in your $scope.Groups you've got Name not name

<div ng-app='myApp' ng-controller="ArrayController">
    <select ng-model="group" ng-options="Group.Name for Group in Groups"></select>
    <div class="col-md-4" ng-show="group.name.Value == 'new'">
        <input class="text-box" type="text" name="NewValue" ng-model="newValue" />
        <button ng-click="add(newValue)">Add</button>
    </div>
    <p>Here I want Value Only[Not object]: {{group.Name}}</p>
    <p>Now I get it in this way: {{group.name.Name}}</p>
    <p><b>But I want group.name to be string not object</b>
    </p>
</div>

answered Jul 17, 2014 at 14:48

sylwester

16.5k1 gold badge27 silver badges33 bronze badges

1 Comment

Muffin Over a year ago

Thanks for your answer. But I wanted to bind string value only. That I got from mezes' answer.

Collectives™ on Stack Overflow

AngularJS select value of property instead of object

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related