I was stuck with using negate boolean values,
Refer the below code
<label>Click me to toggle: <input type="checkbox" ng-model="!checked"></label><br/>
<button ng-model="button" ng-disabled="!checked">Button</button>
If i use above [ngModel:nonassign] error throws
how to bind negote boolean expression for ng-model value?
Thanks in advance
With AngularJS 1.3+ you can use ng-true-value and ng-false-value. This will reverse the value.
var app = angular
.module('app', [])
.controller('ctrl', function($scope) {
$scope.checked = true;
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0/angular.min.js"></script>
<div ng-app="app" ng-controller="ctrl">
<label>
Click me to toggle:
<input type="checkbox" ng-model="checked" ng-true-value="false" ng-false-value="true">
</label>
<button ng-model="button" ng-disabled="!checked">Button</button>
</div>Try using ng-disabled tag rather than enabled. You cannot set ng-model="!checked" since the model variable must be a variable, which cannot include expressions. You can adjust the condition inside the ng-disabled tag for that. Please check the code snippet.
<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.bootcss.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body>
<div ng-app="myApp" ng-controller="myCtrl">
<label>Click me to toggle:
<input type="checkbox" ng-model="checked">
</label>
<br/>
<button ng-model="button" ng-disabled="checked">Button</button>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope) {
});
</script>
</body>
</html>You can find the documentation of ng-disabled here and example here
$scope.checked = newValue but $scope.!checked = newValue doesn't make any sense.
!:ng-model="checked".