2016-02-10 6 views
-1

У меня простая форму расчета зарплаты в AngularJS. Ниже мой HTML:Радио кнопки и список в AngularJS

<div ng-app="myApp" ng-controller="personCtrl"> 

Gross: <input type= "text" ng-model="Gross"><br> 
<br/> 
Deductions:<fieldset> 
IT : <input type= "text" size = 12 maxlength = 4 ng-model="IT"><br> 
CPP : <input type= "text" ng-model="CPP"><br> 
EI : <input type= "text" ng-model="EI"><br> 
<br> 
</fieldset> 


Gender:<fieldset> 
<input type="radio" ng-model = "sex" value = "male"> Male 
<br> 
<input type="radio" ng-model ="sex" value = "female" > Female 
</fieldset> 
Dependants:<fieldset> 
<select> 
<option value="3">3</option> 
<option value="4">4</option> 
</select> 
</fieldset> 


<br/> 
{{Salary()}} 

</div> 

- А код JavaScript ниже:

var app = angular.module('myApp', []); 
app.controller('personCtrl', function($scope) { 
    $scope.Gross= 0; 
$scope.IT = 0; 
$scope.CPP = 0; 
$scope.EI = 0; 
$scope.sex = 
$scope.Salary = function() { 

    return (Number($scope.Gross) - (Number($scope.Gross) * (Number($scope.IT)/100) + Number($scope.Gross) * (Number($scope.CPP)/100 ) + Number($scope.Gross) * (Number($scope.EI)/100))); 
} 
}); 

Мой вопрос заключается в том, что я в состоянии вычислить вычеты с полем ввода, но когда Я выбираю пол Женский, тогда I.Tex должен уменьшаться на 2%. Аналогично, если я выбираю 3 в иждивенцах, тогда ITex также должен вычесть 1 процент. На самом деле я не могу осуществить радиокнопку и перечислить в расчете

ответ

2

См. Живой пример на jsfiddle.

var myApp = angular.module("myApp", []); 
 

 

 
myApp.controller("myCtrl", function($scope) { 
 
    $scope.sex = 1; 
 
    $scope.depends = "3"; 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<body ng-app="myApp" ng-controller="myCtrl"> 
 
    Gender: 
 
    <div> 
 
    <label> 
 
     <input type="radio" name="sex" ng-model="sex" ng-value="0"> Male</label> 
 
    <br> 
 
    <label> 
 
     <input type="radio" name="sex" ng-model="sex" ng-value="1"> Female</label> 
 
    <pre>sex = {{sex}}</pre> 
 
    </div> 
 
    Dependants: 
 
    <fieldset> 
 
    <select ng-model="depends"> 
 
     <option value="3">3</option> 
 
     <option value="4">4</option> 
 
    </select> 
 
    <pre>depends = {{depends}}</pre> 
 
    </fieldset> 
 
</body>

0

Вы можете попробовать что-то, как показано ниже.

myApp.controller('personCtrl', function($scope) { 
$scope.Gross= 0; 
$scope.IT = 0; 
$scope.CPP = 0; 
$scope.EI = 0; 
$scope.sex = 'female'; 
$scope.dependents = '3'; 
$scope.Salary = function() { 


    var result = Number($scope.Gross) - 
     ( 
       Number($scope.Gross) * (Number($scope.IT)/100) + 
       Number($scope.Gross) * (Number($scope.CPP)/100) + 
       Number($scope.Gross) * (Number($scope.EI)/100) 
     ); 

    if($scope.sex == 'female') 
    { 
     result = result - (2*result/100); 
    } 

    if($scope.dependents==3) 
    { 
     result = result - (1*result/100); 
    } 
    return result 
} 
});