I'm currently working on an application that requires indicating red for negative values and blue for positive values in a calculation.
<td class="amount debit">
<input type="text" class="form-control" ng-model="vm.model.form.amount_debit">
</td>
<td class="amount credit">
<input type="text" class="form-control" ng-model="vm.model.form.amount_credit">
</td>
<td class="amount balance" ng-class="{
negative : (book.total_balance + +vm.model.form.amount_debit - +vm.model.form.amount_credit) < 0.00,
positive : (book.total_balance + vm.model.form.amount_debit - +vm.model.form.amount_credit) >= 0.00
}">
@{{vm.model.book.total_balance + +vm.model.form.amount_debit - +vm.model.form.amount_credit| currency:""}}
</td>
The amount in the balance field is calculated whenever the user inputs a value into either input field. However, there seems to be an issue with how the output is displayed:
When I enter a value in the amount debit field, it displays as a positive value. But when I enter a value in the amount credit field, it shows me a negative value.
This discrepancy does not accurately represent the intended output I am looking for.
For example, if the balance is $1,000 and the amount debit is $300,
it correctly shows a total of $1,300 in positive.
However, if the balance is still $1,000 but the amount credit is $300,
the total incorrectly shows as $700 in the negative. It should have remained positive.
Could there be an error in my logic somewhere? Where can I make adjustments to fix this issue? Thank you.