AngularJS: Mapping check box to an array

Question

I currently have checkboxes that the user can choose between which then are sent to my model,

<div ng-repeat="option in roleOptions">
    <input type="checkbox" value="{{option.Id}}" ng-model="user.Roles[option.Id]">{{option.Name}}
</div>

The problem is that this produces a result like this,

{
  0: 'a',
  1: 'b',
  2: 'c'
}

Whereas I want an output like this,

['a','b','c']

I realise that I could just convert them after, but I'd really like to change my html in some way so that it maps straight to an array, because I will also be sending this data in an array format to the html as well so I don't want to have to keep converting all the time.

Any ideas?

Index · Accepted Answer · 2015-05-29 12:03:38Z

1

ng-model only works on an object. You are trying to push a value onto an array. You are probably best of using ng-click and creating your own handler to push / shift from the array.

<div ng-repeat="option in roleOptions">
    <input type="checkbox" value="{{option.Id}}" ng-click="addToArray(user.Roles, option.Id)">{{option.Name}}
</div>

answered May 29, 2015 at 12:03

Index

2,3814 gold badges33 silver badges51 bronze badges

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

3 Comments

user3407039 Over a year ago

OK thanks. I guess I'll have to do it the awkward way and convert it back and forth.

Index Over a year ago

Shouldn't be that awkward. Just create a function which add/removes values from the array you are using. No more fuzz needed :)

Index Over a year ago

@user3407039 If this answer was satisfactory, please accept it.

Collectives™ on Stack Overflow

AngularJS: Mapping check box to an array

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related