ng disabled在放入多个表达式时失败

ng-disabled is failing when put more than one expression

本文关键字:表达式 失败 disabled ng      更新时间:2023-09-26

在一个场景中,我想使用单选按钮来选择选项,在明确选择后,我希望用户进行我使用javascript确认方法进行的确认。在确认选择后,应该只启用下一个按钮。看看下面的代码

HTML

  <body ng-controller="MainCtrl">
  <div ng-repeat="person in names">
    <input class="d-radio__input" ng-model="$parent.selectedCustomer" type="radio" ng-value="person" value="{{person.name}}" name="radio" ng-click="confirm()" required /> {{person.name}}
  </div>
  <button>Back</button>
  <button ng-click="next()" ng-disabled="selectedCustomer =='' && confirmation == 0 ">Next</button>
</body>

Javascript

    app.controller('MainCtrl', function($scope) {
  $scope.selectedCustomer ='';
  $scope.confirmation=0;
  $scope.names = [{name:"Mayur"},{name:"Sameer"}];
                $scope.next = function () {
                    $scope.navigator =  $scope.navigator + 1 ;
                    console.log($scope.navigator)
                };
                $scope.confirm = function (location) {
                    var r = confirm("Click Ok to continue the offboarding process for (" + $scope.selectedCustomer.customerName + ")");
                    if (r === true) {
                        $scope.confirmation = 1;
                        console.log($scope.confirmation );
                    } else {
                        $scope.confirmation = 0;
                        console.log($scope.confirmation );
                    }
                }
});

因此,当我立即选择一个名称时,无论我在确认对话框中按什么,它都会启用下一个按钮。但当我只保留一个条件表达式来为ng求值时,它就可以正常工作了。不知道如何在ng disabled中添加多个条件。

如果我做错了什么,请告诉我。

看看Plunker

根据注释,因为它是一个禁用的ng,并且您使用的是and(&&),只有当两者都为true时,它才会禁用,请使用OR(||),根据plunk:

<button ng-click="next()" ng-disabled="selectedCustomer == '' || !confirmation ">Next</button>

http://plnkr.co/edit/pGTuuE9RyGz7WOKSnClG?p=preview

这可能是您的要求。

var app =angular.module('app' ,[])
app.controller('MainCtrl', function($scope) {
  $scope.selectedCustomer ='';
  $scope.confirmation=0;
  $scope.names = [{name:"Mayur"},{name:"Sameer"}];
                $scope.next = function () {
                    $scope.navigator =  $scope.navigator + 1 ;
                    console.log($scope.navigator)
                };
                $scope.confirm = function (location) {
                    var r = confirm("Click Ok to continue the offboarding process for (" + $scope.selectedCustomer.customerName + ")");
                    if (r === true) {
                        $scope.confirmation = 1;
                        console.log($scope.confirmation );
                    } else {
                        $scope.confirmation = 0;
                        console.log($scope.confirmation );
                    }
                }
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app='app' ng-controller="MainCtrl">
  <div ng-repeat="person in names">
    <input class="d-radio__input" ng-model="$parent.selectedCustomer" type="radio" ng-value="person" value="{{person.name}}" name="radio" ng-click="confirm()" required /> {{person.name}}
  </div>
  <button>Back</button>
  <button ng-click="next()" ng-disabled="selectedCustomer =='' || confirmation == 0 ">Next</button>
</body>