jeudi 22 juin 2017

Display checkboxes in with AngularJS based on two object arrays

I know there are several similar topics already but I found none that really matches my problem.

When opening my AngularJS app/website I am loading two arrays of objects (both are of the same type). One list contains all possible values (called sources here) and the other list is a selection of elements from the first.

My goal is display all sources as checkboxes. The ones from the second list have to be preselected, the rest not. Now the user can select/deselect checkboxes. If he does so I need to inform the server (with the source.id).

What I got so far:

exampleApp.controller('testController', [ '$scope', '$http', function($scope, $http) {
        $scope.sources = [];
        $scope.selectedSources = [];
        $scope.changeSource = function(source) {...};
    })

and

<div ng-repeat="source in sources">
            <input
                    type="checkbox"
                    name="source.name"
                    value=""
                    ng-model="??"
                    ng-change="changeSource(source.id)"
            > 
        </div>

What I can't figure out is how I can get ng-model to preselect the right checkboxes and how to get the new (and old) values to changeSource(). Is there an elegant way of doing that?




Aucun commentaire:

Enregistrer un commentaire