2

Tenho um problema com expressão no angular

Assim não funciona !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> 

Assim funciona 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>

preciso de 2 checkboxs que a medida que seleciono um dos dois, certo campo será habilitado, seria isso um bug?

5
  • Essa pergunta não se encaixa na tag regex
    – Paz
    Commented 2/10/2017 às 14:32
  • Quando um checkbox está marcado, ele automaticamente se torna TRUE, a condição " !checked || !checked2 " não vai funcionar porque ele diz: "Só funcione se algum dos checkbox estiverem False (desmarcados)"
    – Jackson
    Commented 2/10/2017 às 14:34
  • Eu não entendi onde você está identificando possível Bug aí, as condições estão corretas. O Ng-Disable só funciona se a condição dentro dele ter output TRUE
    – Jackson
    Commented 2/10/2017 às 14:35
  • Não sei se encaixa como bug, mas desta maneira funcionou !(controle || controle2) A ideia aqui é que, com checkbox marcado o retorno seria true, negando isso o retorno seria false, negando o ng-disabled do campo lembrando que testei a expressão !controle || !controle2 dentro de um ng-checked e funcionou, não precisei alterar para !(controle || controle2), apenas dentro do ng-disabled que não funcionou.
    – HUGO PABLO
    Commented 2/10/2017 às 14:44
  • Vou responder abaixo para você entender melhor.
    – Jackson
    Commented 2/10/2017 às 15:02

3 Respostas 3

2

Como mencionado pelo usuário Jackson:

Quando um checkbox está marcado, ele automaticamente se torna TRUE

Do jeito que você fez ela só funcionará caso um dos dois checkbox estiverem desmarcados, pois você usou o token de negação ! antes de controle e controle2.
O que acho que você quer fazer é colocar por fora da parte (controle || controle2), resultando em !(controle || controle2) ou voltar a usar ng-checked como você mencionou no comentário.

2

Isso está certo. Vou fazer em booleans para você entender. Output do NG-Disable desabilita o elemento quando o output dele é True.

Na sua dúvida de !(controle1 || controle2) seria !( true || true )

Essa expressão inicia com os dois controles FALSE, então... !(false || false) => true

Se você marca um ou dois, ele irá desabilitar o botão, porque...
!(true || true) => false
!(false || true) => false

É igual matemática, execute o que há dentro do parenteses, para depois executar o que está fora.

2
  • boa explicação +1!
    – Paz
    Commented 2/10/2017 às 16:22
  • 2
    Vlw cara percebi msm,Confundi na lógica msm. !controle1 || !controle2 assim apenas se os dois estivessem como true, para saída ser false, desabilitando o disabled. !controle1 || !controle2 <> !(controle1 || controle2)
    – HUGO PABLO
    Commented 2/10/2017 às 17:47
2

A diretiva ng-disabled, se receber um valor false, vai liberar o botão, se receber um valor true vai bloquear o botão, então, a lógica sua pode ser analisada por uma função, que ao final deve negar o resultado, exemplo:

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>

Referencia: ng-disabled

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .