jeudi 28 mai 2015

How to use ng-checked with a function in angularjs

I'm trying to use ng-checked for dynamically built checkbox lists but I can't get it to work.

Here is the code I use for the template part:

<div ng-repeat="(y, count) in facets.year track by $index" class="checkbox" ng-class="count ? '' : 'empty'">
    <label>
        <input type="checkbox" ng-checked="isDisjunctiveRefined('year', y)" ng-click="toggleRefine($event, 'year', y)" ng-disabled="!count">
        {{ y }} <span>({{ count }})</span>
    </label>
</div>

And this one is the isDisjunctiveRefined and the toggleRefine methods in my controller

$scope.toggleRefine = function($event, facet, value) {
    $event.preventDefault();
    $scope.forumIdx.toggleRefine(facet, value);
    $scope.checked[facet][value] = $scope.forumIdx.isDisjunctiveRefined(facet, value);
    search();
};

$scope.isDisjunctiveRefined = function(facet, value) {
    if (value == 2015)
        console.log($scope.forumIdx.isDisjunctiveRefined(facet, value));
    return $scope.forumIdx.isDisjunctiveRefined(facet, value);
};

Every time I click a checkbox, I see that isDisjunctiveRefined is called and it returns a boolean with the correct value (true if checked, false otherwise). However, my checkbox is never updated and stills look unchecked.

I read multiple things like the fact that ng-checked must be bound to a variable, but also saw some people using it with a function so I just can't understand what happen there.

Also, please notice that the search method may update the facets list




Aucun commentaire:

Enregistrer un commentaire