Angularjs displaying a calculated value depending on true/false flags

Issue

I'm facing a need to display a sum of values (related to $scope variables) depending on the selection of flags. For instance:

• There are 4 $scope variables (e.g. $scope.Var_1, $scope.Var_2...) containing integer values,
• There are 4 $scope variables (e.g. $scope.Var_1_Flag, $scope.Var_2_Flag...)containing true or false for each of the above integer variables.

So, in we have:

$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 ;

then 10 will be displayed, but if:

$scope.Var_1_Flag = true ;
$scope.Var_2_Flag = false;
$scope.Var_3_Flag = false;
$scope.Var_4_Flag = true ;

then 5 will be displayed.

Does AngularJS support a binding syntax that would realize this?

Solution

I found an amazingly simple solution that does the job exactly as I wanted.

Here is a piece of code within the controller:

$scope.Test_1_Value = 1     ;
$scope.Test_1_Flag  = true  ;

$scope.Test_2_Value = 2     ;
$scope.Test_2_Flag  = true  ;

$scope.Test_3_Value = 3     ;
$scope.Test_3_Flag  = true  ;

$scope.Test_4_Value = 4     ;
$scope.Test_4_Flag  = true  ;


$scope.ConditionalAdd = function (p1,p2,p3,p4) {
    var aaa = 0 ;
    if ($scope.Test_1_Flag) {aaa = aaa + $scope.Test_1_Value }
    if ($scope.Test_2_Flag) {aaa = aaa + $scope.Test_2_Value }
    if ($scope.Test_3_Flag) {aaa = aaa + $scope.Test_3_Value }
    if ($scope.Test_4_Flag) {aaa = aaa + $scope.Test_4_Value }
    return aaa ;
}

and here the HTML part:

    <input type="checkbox" ng-model="Test_1_Flag"> Add 1
    <br>
    <input type="checkbox" ng-model="Test_2_Flag"> Add 2
    <br>
    <input type="checkbox" ng-model="Test_3_Flag"> Add 3
    <br>
    <input type="checkbox" ng-model="Test_4_Flag"> Add 4
    <br>
    <label>Total 1: </label> {{ConditionalAdd(Test_1_Value,Test_2_Value,Test_3_Value,Test_4_Value)}}

As the checkboxes are changed (checked/unchecked), the result shown next to Total 1: is updated automatically, as needed.

The values Test_x_Value are part of the data generated for the creation and population of the table (using ng-repeat), and hence are available within each single cell of the table.

So, no filters, no watches.

Thanks to every one for your support :-).

EDIT:

I just finished implementing this solution and tested it with a table containing over 2,500 cells. This solution works perfectly well, including performance.

Answered By - FDavidov