40

I am trying to do it in proper way with less pain, but i can't figure out how to deal with ng-model and binding it to the selected list etc and moreover i need to populate that list in later time and keep selected objects in it.

categories = [ { "name": "Sport", "id": "50d5ad" } , {"name": "General", "id": "678ffr" } ]

    <span ng-repeat="category in categories">
      <label class="checkbox" for="{{category.id}}">
        <input type="checkbox" value="{{category.id}}" ng-model="??" ng-click="??" name="group" id="{{category.id}}" />
        {{category.name}}
      </label>
    </span>

I have to override the categories each time the list is populated since it will be pulled out from a server.

So I guess I need to have arrays and the second one will hold the selected objects?

If I am right, how do I preselect checkboxes?

Do I need ng-click in order call custom function to store the selected object in the other array?

Do I need ng-model in checkbox And what for?

What is the proper-way with less pain?

Ruben Helsloot
  • 12,582
  • 6
  • 26
  • 49
Jakub Kuchar
  • 1,665
  • 2
  • 23
  • 39

1 Answers1

70

I have to override the categories each time the list is populated since it will be pull out form server. So i quess i need to have arrays and the second one will hold the selected objects?

Yes, since it is a list you can/should use arrays. The information about the selected items/objects should be stored on your scope model (example below).

If I am right, how do I preselected checkboxes?

Save the ID's of the selected options/checkboxes on your model and let the ng-model do the rest.

Do I need ng-click in order call custom function to store the selected object in the other array?

No, you don't need it, ng-model is enough.

Do i need ng-model in check box? And what for?

Yes, you need it. The ng-model is responsible for storing the selected options on your model and for making the ('pre-')selection automatic.

jsfiddle http://jsfiddle.net/bmleite/PQvQ2/

bmleite
  • 26,850
  • 4
  • 71
  • 46
  • Thank you for your answer. But how about i would like to store the hole object in let's something like selection.objects rather than selection.ids? Is still possible? – Jakub Kuchar Feb 13 '13 at 06:28
  • 4
    You can still do that, in this case it seems easier to just watch for changes on the `selections.ids` and create the `selection.objects` based on that. Example: http://jsfiddle.net/bmleite/PQvQ2/1/ – bmleite Feb 13 '13 at 10:20
  • 5
    An simplification of this - simpler is gooder sometimes http://jsfiddle.net/PQvQ2/82/ or within the one object http://jsfiddle.net/PQvQ2/83/ – Steve Black Jul 17 '13 at 00:47
  • Is it possible to show another ng-repeat with only the selected objects in it? – tdhulster Mar 08 '14 at 15:15
  • 1
    Is there any easy way to toggle all the checkboxes? – Federico Apr 22 '14 at 21:32
  • When I change from category.id to category in ng-model I'm not able to get the whole object instead I'm getting as "[object Object]" http://jsfiddle.net/j6sLudt2/ – forgottofly Oct 11 '16 at 06:26