我需要根据标志的选择来显示值的总和(与 $scope
变量相关)。例如:
- 有 4
$scope
包含整数值的变量(例如$scope.Var_1
、$scope.Var_2
...), - 有 4
$scope
包含$scope.Var_1_Flag
的变量(例如$scope.Var_2_Flag
、true
...)或false
对于上述每个整数变量。
所以,我们有:
$scope.Var_1 = 1 ;
$scope.Var_2 = 2 ;
$scope.Var_3 = 3 ;
$scope.Var_4 = 4 ;
$scope.Var_1_Flag = true ;
$scope.Var_2_Flag = true ;
$scope.Var_3_Flag = true ;
$scope.Var_4_Flag = true ;
然后 10
将显示,但如果:
$scope.Var_1_Flag = true ;
$scope.Var_2_Flag = false;
$scope.Var_3_Flag = false;
$scope.Var_4_Flag = true ;
然后 5
将显示。
AngularJS 是否支持可以实现这一点的绑定(bind)语法?
最佳答案
标记:
<div ng-controller="MyCtrl">
<input type="checkbox" ng-model="Var_1_Flag" ng-checked="Var_1_Flag" ng-change="changeStatus(Var_1_Flag);" />
<input type="checkbox" ng-model="Var_2_Flag" ng-checked="Var_2_Flag" ng-change="changeStatus(Var_2_Flag);" />
<input type="checkbox" ng-model="Var_3_Flag" ng-checked="Var_3_Flag" ng-change="changeStatus(Var_3_Flag);" />
<input type="checkbox" ng-model="Var_4_Flag" ng-checked="Var_4_Flag" ng-change="changeStatus(Var_4_Flag);" />
<br/> Sum is: {{sum}}
</div>
JS:
var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
$scope.sum = 0;
$scope.Var_1 = 1;
$scope.Var_2 = 2;
$scope.Var_3 = 3;
$scope.Var_4 = 4;
$scope.Var_1_Flag = true;
$scope.Var_2_Flag = false;
$scope.Var_3_Flag = false;
$scope.Var_4_Flag = true;
$scope.changeStatus = function(checkValue) {
$scope.checkValue = !checkValue;
$scope.calculateSum();
}
$scope.calculateSum = function() {
$scope.sum = ($scope.Var_1_Flag ? $scope.Var_1 : 0) + ($scope.Var_2_Flag ? $scope.Var_2 : 0) + ($scope.Var_3_Flag ? $scope.Var_3 : 0) + ($scope.Var_4_Flag ? $scope.Var_4 : 0)
}
$scope.calculateSum();
}
检查这个http://jsfiddle.net/ananyaojha/ADukg/13641/
// Need to keep track of watcher
$scope.$watch('Var_1_Flag', function(newVal, oldVal){
// this callback is invoked if any change is detected in the value of Var_1_Flag
// add condition and update scope using $apply or $evalAsync
// You have to set watchers also whenever flags are keep getting changed for all falg types.
})
关于javascript - Angularjs 根据 true/false 标志显示计算值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45476598/