how do I execute a function in angular.js, from an input checkbox?

angularjs

Solution

Here is a plunker with your code and some corrections (ie: you used the tags delimiters {[{item.title}]} instead of {{item.title}})

Link: http://plnkr.co/edit/f9ngMMe8XJT4QDlA0Nx0?p=preview.

In this demo, there is a table with rows to display the item.path/item.id as a link, followed by the item.title and a checkbox which value is set to YES/NO according to its state. When the checkbox state has changed, the toggleSync function is called with the item as a parameter. The input checkbox has as model item.value, which is a property available inside of the toggleSync function.

Problem

I have a list of things with switches. How can I get each switch to call a function with that object and the switch as parameters? I have tried to set the "ng-change" directive for my checkboxes, but the function doesn't seem to get called. How do I call the toggleSync function I made? I am a total newb, so I'm sorry if I need serious help. ``` <div id="track-list" ng-controller="Controller" ng-init="update()"> <div class="data-table"> <table class="table table-hover tablesorter"> <tr ng-repeat="item in items"> <td><a href='{[{item.path}]}/{[{item.id}]}'>{[{item.title}]}</a></td> <td>{[{item.time_created}]}</td> <td> <div class=checkbox> <input ng-model="value" id="check{[{$index}]}" type="checkbox" ng-checked="!item.deleted" ng-change="toggleSync(item.id, this)" ng-true-value="YES" ng-false-value="NO"/> <label for="check{[{$index}]}">{{value}}</label> </div> </td> </tr> </table> function Controller($scope) { console.log("init"); $scope.items = []; $scope.toggleSync = function(objectId, input) { console.log("toggle sync"); } } ```

Original source