Question

我已经构建了一个简单的税收计算器，我希望将其集成到angularjs应用程序中。我已经看过angularjs，并且无法理解如何集成现有的js代码。有人可以建议一种简单的方法（重新）将它构建成angularjs应用程序吗？

由于

//constructor to create the initial object. Accepts object and creates new taxCalculation object
function taxCalculation(configuration){
      this.superAnnuationPercentage = configuration.superAnnuationPercentage;
      this.superAnnuationTaxRate    = configuration.superAnnuationTaxRate;
};

//creating a new object "tax" with taxCalculation constructor

var tax = new taxCalculation({
    superAnnuationPercentage: 9.25,
    superAnnuationTaxRate:  15
});

//Defines HECS/HELP repayment brackets
var hecs = [
{from:0,     percentage:0},
{from:53346, percentage:4},
{from:59422, percentage:4.5},
{from:65498, percentage:5.0},
{from:68940, percentage:5.5},
{from:74106, percentage:6.0},
{from:80258, percentage:6.5},
{from:84482, percentage:7.0},
{from:92971, percentage:7.5}, 
{from:99070, percentage:8.0},
];

//Defines the tax brackets
var taxBracket = [
    {from: 0, percentage: 0, baseAmount: 0},
    {from: 18201, percentage: 19, over: 18200, baseAmount: 0},
    {from: 37001, percentage: 32.5, over: 37000, baseAmount: 3752},
    {from: 80001, percentage: 37, over: 80000, baseAmount: 17547},
    {from: 180001, percentage: 45, over: 180000, baseAmount: 54547}
];

//Calculate the super annuation component of grossIncome
taxCalculation.prototype.grossSuperAnnuation = function(income){
    return income * this.superAnnuationPercentage / 100;

};



//Calculates tax on super annuation component
taxCalculation.prototype.superAnnuationTax = function(grossSuper){
  return grossSuper * this.superAnnuationTaxRate / 100;
};


//Calculate gross income
taxCalculation.prototype.grossIncome = function(grossIncome){
    return grossIncome - this.grossSuperAnnuation(grossIncome);

};


//Calculates HECS bracket based on gross income
taxCalculation.prototype.hecsCalculation = function (income){
        for (var x = 0; x < hecs.length; x++){
            if(income >= hecs[x].from){
            var percentage = hecs[x].percentage/100;
            }
        };        
        return income * percentage;
};


//Loops through taxBracket object and finds the tax bracket for the post deduction gross income amount
taxCalculation.prototype.taxBracketCalculation = function (grossSuperIncome){
    for(var x = 0; x < taxBracket.length; x++){
        if(grossSuperIncome <= taxBracket[x].from){
            var amountOver = grossSuperIncome - taxBracket[x].over;
            var percent = taxBracket[x].percentage / 100;
            return taxBracket[x].baseAmount + (amountOver * percent);
        }

    };
};

//Calculate all of the factors in tax calculation
taxCalculation.prototype.totalTax = function (income){
  var taxResult = {
    income: income
  };
  taxResult.superAnnuation = this.grossSuperAnnuation(income);
  taxResult.grossIncome = this.grossIncome(income);
  taxResult.taxBase = this.taxBracketCalculation(taxResult.grossIncome);
  taxResult.taxSuper = this.superAnnuationTax(taxResult.superAnnuation);
  taxResult.hecs = this.hecsCalculation(income);

  return taxResult;
};

var test = tax.totalTax(65000);
console.log(test);

Answer 1

正如Shomz和Huafu已经解释的那样，你应该把你的代码放到angularjs服务中。

创建包含所有代码的服务。但我认为您可能需要更改功能的名称。仅作为示例的一部分代码：

app.service('taxService', function () {

function taxCalculation(configuration) {
    this.superAnnuationPercentage = configuration.superAnnuationPercentage;
    this.superAnnuationTaxRate = configuration.superAnnuationTaxRate;
};

//creating a new object "tax" with taxCalculation constructor
var tax = new taxCalculation({
    superAnnuationPercentage: 9.25,
    superAnnuationTaxRate: 15
});


//Calculate the super annuation component of grossIncome
this.grossSuperAnnuation = function (income) {
    return income * tax.superAnnuationPercentage / 100;

};


}

顺便说一句，我认为您的代码中存在拼写错误，this.superAnnuationPercentage在对象tax之外不存在。

然后引用控制器内的服务：

app.controller('IncomeController',

function IncomeController($scope, taxService) {
    $scope.tax = "undefined"
    $scope.calculate = function () {
        $scope.tax = taxService.grossSuperAnnuation($scope.income);
    }
});

引用控制器并从angularjs页面调用calculate函数：

<div ng-controller="IncomeController">
    <input ng-model="income" />
    <button ng-click="calculate()">Calculate</button>
    <p>{{tax}}</p>
</div>

Example fiddle

从现有的javascript代码创建angularjs应用程序

1 个答案: