Deaktivieren Eingabefeld, wenn einige Bedingung in eckigen js

Question

Eigentlich mache ich ein Check-out-System für meine Collage-Projekt, das 7 Personen hat und jede Person wird 8 Stunden arbeiten und wir haben insgesamt 56 Stunden, so System wird nur erlauben 56 Stunden und wenn jemand zusätzliche Zeit (insgesamt 3 Shift in Tag) will, so wird die Gesamtzeit in der nächsten Schicht wie pro Arbeit abziehen und wenn die Gesamtzeit 0 wird das gesamte Eingabefeld deaktiviert (ng-disable), möchte ich machen dies durch Angular aber einige Syntax Problem meines Code zugewandt ist

angular.module('myApp', []) 
 
.controller('myCtrl', function() { 
 
    var vm = this; 
 
    var total = 56, 
 
    var checklist = [vm.spvc1,vm.spvc2,vm.spvc3,vm.spvc4,vm.spvc5,vm.spvc6,vm.spvc7]; 
 
    vm.check = function(){ 
 
    for(var i=0;i<=checklist.length; i++){  
 
    if(checklist[i]!==""){ 
 
     var totalcheck = total-8; 
 
    } 
 
    return totalcheck; 
 
    } 
 
    console.log(totalcheck); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl as main"> 
 
    <input type="text" ng-model="main.spvc1"> 
 
    <input type="text" ng-model="main.spvc2"> 
 
    <input type="text" ng-model="main.spvc3"> 
 
    <input type="text" ng-model="main.spvc4"> 
 
    <input type="text" ng-model="main.spvc5"> 
 
    <input type="text" ng-model="main.spvc6"> 
 
    <input type="text" ng-model="main.spvc7"> 
 
    </div>

ich bin Neuling in A ngular und verwirren, wie man verwendet ng-disable, Vielen Dank im Voraus

Answer 1

zuerst müssen Sie hinzufügen ng-disabled auf Ihre Eingaben

<div ng-app="myApp" ng-controller="myCtrl as main"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc1"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc2"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc3"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc4"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc5"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc6"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc7"> 
</div> 

in Ihrem Controller nach Berechnungen für die gesamte Zeitprüfung zu tun, wenn es Null ist und setze disableAll entsprechend.

if(totaltime == 0){ 
    $scope.disableAll = true; 
} 

Answer 2

<input type="text" ng-disabled=" workhour > 56 ?true:false" ng-model="main.spvc1"> 
 
means if work hour is greaterthen 56 then disable 
 

 
replace the work hr with your object

Answer 3

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
<div ng-app="myApp" ng-controller="myCtrl as main"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc1"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc2"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc3"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc4"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc5"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc6"> 
    <input type="text" ng-disabled="disableAll" ng-model="main.spvc7"> 
</div> 

angular.module('myApp', []) 
.controller('myCtrl', function() { 
    var vm = this; 
    var total = 56; 
    var checklist = [vm.spvc1,vm.spvc2,vm.spvc3,vm.spvc4,vm.spvc5,vm.spvc6,vm.spvc7]; 
    vm.check = function(){ 
    for(var i=0;i<=checklist.length(); i++){  
     if(checklist[i]!==""){ 
     var total = total-8; 
     } 
    } 
    if(total === 0){ 
     $scope.disableAll = true; 
    } 
    return total; 
    } 
    console.log(total); 
});