How to programmatically uncheck checkbox?

Question

I want to programmatically uncheck a checkbox. I know how to it in javascript but since I'm using angular, i think it's different.

Here's the link of jsfiddle : https://jsfiddle.net/TKVH6/499/

This is the first time I used jsfiddle so please let me know if you cant see the script and html.

This is the html

<input type="checkbox" ng-model="v" ng-click="checkAll()" />
<button ng-click="x()">eto</button>

This is the angular

$scope.x = function () {
    $scope.v.checked=false;
};

I know there are lots of question like this, I've already tried those but I can't make it work.

Thanks!

Answer 1

<input type="checkbox" ng-checked="v" ng-click="checkAll()" />

In your controller

$scope.v = true; // or false

Answer 2

First thing : You have specified controller on ul and bind click event of button outside the ul so moved ng-controller on div.

Second thing: In order to check it pragmatically you need to set $scope.Items[i].Selected = true;

$scope.x = function () {
    alert("x");
    $scope.Items[0].Selected=true;
};

Why we need to set Selected property of Items[i] while I have not declared?

The reason behind that is your html binding is something like this:

<li ng-repeat="item in Items">
    <label>{{item.Name}}
        <input type="checkbox" ng-model="item.Selected" />
    </label>
</li>

Here every item is element from Items array that means your checkbox checked value is now bind to selected property of that object. Even though you have not defined that property in Items collection angular will create it and will bind it to that property. So you are required to set that property. I hope it would help you.

Here is working fiddle => link