Expression within ng-disabled

Asked

Viewed 4,764 times

2

I have a problem with angular expression

So it doesn’t work ! checked || ! checked2

<body ng-app="">
    <label>
        Click me to toggle: 
        <input type="checkbox" ng-model="checked"> 
        &nbsp; 
        <input type="checkbox" ng-model="checked2">
    </label>
    <br/>
    <button ng-model="button" ng-disabled="!checked || !checked2">Button</button>
</body>

So it works checked || checked2

<body ng-app="">
    <label>
        Click me to toggle: 
        <input type="checkbox" ng-model="checked"> 
        &nbsp; 
        <input type="checkbox" ng-model="checked2">
    </label>
    <br/>
    <button ng-model="button" ng-disabled="!checked || !checked2">Button</button>
</body>

need 2 checkboxs that as I select one of the two, certain field will be enabled, it would be a bug?

angularjs

  • This question does not fit the regex tag

  • When a checkbox is checked, it automatically becomes TRUE, the condition " ! checked || ! checked2 " will not work because it says: "Only works if one of the checkboxes is False (unchecked)"

  • I don’t understand where you are identifying possible Bug there, the conditions are correct. Ng-Disable only works if the condition inside it has TRUE output

  • I don’t know if it fits as a bug, but in this way it worked !(control || controle2) The idea here is that with checkbox marked the return would be true, denying that the return would be false, denying the ng-disabled of the field , remembering that I tested the expression ! control || ! control2 inside an ng-checked and worked, did not need to change to !(control || control2) , just inside ng-disabled that didn’t work.

  • I will answer below for you to understand better.

3 answers

2

As mentioned by the user Jackson:

When a checkbox is checked, it automatically becomes TRUE

The way you did it will only work if one of the two checkboxes is unchecked, because you used the negation token ! before controle and controle2.
What I think you want to do is put aside (controle || controle2), resulting in !(controle || controle2) or re-use ng-checked as you mentioned in the comment.

2

That’s right. I’ll do it in booleans for you to understand. NG-Disable output disables the element when its output is True.

In your doubt of !(control1 || control2) would be !( true || true )

This expression starts with the two FALSE controls, then... !(false || false) => true

If you dial one or two, it will disable the button because...
!(true || true) => false
!(false || true) => false

It’s like math, run what’s inside parentheses, then run what’s outside.

  • good explanation +1!

  • 2

    Vlw face I noticed msm,Confused in logic msm. ! controle1 || ! controle2 so only if both were true, to output false, disabling disabled. ! controle1 || ! controle2 <> ! (controle1 || controle2)

2

The directive ng-disabled, if you receive a value false, will release the button if you receive a value true will lock the button, then your logic can be analyzed by a function, which at the end must deny the result, example:

var app = angular.module("app", []);
app.controller("ctrl", function($scope) {
  $scope.checked = false;
  $scope.checked2 = false;
  $scope.btnStatus = function()
  {
    return !($scope.checked || $scope.checked2);
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="ctrl">
  <label>
        Click me to toggle: 
        <input type="checkbox" ng-model="checked"> 
        &nbsp; 
        <input type="checkbox" ng-model="checked2">
    </label>
  <br/>
  <button ng-model="button" 
    ng-disabled="btnStatus()">Button</button>
</div>

Reference: ng-disabled

Browser other questions tagged angularjs

You are not signed in. Login or sign up in order to post.