Question

我在AngularJS视图中遇到问题。我有条件的一些值，我想计算它们的总和。它在条件之前运行良好但在添加条件之后，发生了一些问题并且它显示结果为NaN。这是我的代码。

<div ng-if = "nnn == 'yes'">
<h3>Sale Roakker (Naam)</h3>
<div class="card-content table-responsive">
    <table class="table table-bordered pagin-table">
        <thead>
            <tr>
                <th>Date</th>
                <th>Name</th>
                <th>Item Name</th>
                <th>Total</th>                  
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="x in sales_items_detail">
                <td>{{ x.date }}</td>
                <td>{{ x.name }}</td>
                <td>{{ x.item_name }}</td>
                <td>{{ (x.amount).toFixed(2) }}</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="2"><strong>Total</strong></td>
                <td><strong>{{amount_sale = amountTotal(sales_items_detail)}}</strong></td>
              </tr>                            
        </tfoot>
    </table>                        
</div>
</div>
<div ng-if = "nnn == 'not'">
<h3>Sale Roakker (Naam)</h3>
<div class="card-content table-responsive">
    <table class="table table-bordered pagin-table">
        <thead>
            <tr>
                <th>Date</th>
                <th>Name</th>
                <th>Item Name</th>
                <th>Rate</th>
                <th>Weight</th>
                <th>Total</th>                  
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="x in sales_items_detail">
                <td>{{ x.date }}</td>
                <td>{{ x.name }}</td>
                <td>{{ x.item_name }}</td>
                <td>{{ x.price }}</td>
                <td>{{ x.quantity }}</td>
                <td>{{ x.price*x.quantity }}</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="4"><strong>Total</strong></td>
                <td><strong>{{amount_sale = saleTotal(sales_items_detail)}}</strong></td>
              </tr>                            
        </tfoot>
    </table>                        
</div>
</div>
<h3>Naqdi Roakker Jama</h3>
<div class="card-content table-responsive">
    <table class="table table-bordered pagin-table">
        <thead>
            <tr>
                <th>Date</th>
                <th>Name</th>
                <th>Detail</th>
                <th>Amount</th>                  
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="x in transection_detail_jama">
                <td>{{ x.date }}</td>
                <td>{{ x.name }}</td>
                <td>{{ x.detail }}</td>
                <td>{{ x.amount }}</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="2"><strong>Total</strong></td>
                <td><strong>{{amount_jama = amountTotal(transection_detail_jama)}}</strong></td>
              </tr>              
        </tfoot>
    </table>                        
</div>
<h3>Naqdi Roakker Naam</h3>
<div class="card-content table-responsive">
    <table class="table table-bordered pagin-table">
        <thead>
            <tr>
                <th>Date</th>
                <th>Name</th>
                <th>Detail</th>
                <th>Amount</th>                  
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="x in transection_detail_naam">
                <td>{{ x.date }}</td>
                <td>{{ x.name }}</td>
                <td>{{ x.detail }}</td>
                <td>{{ x.amount }}</td>
            </tr>
        </tbody>
        <tfoot>
            <tr>
                <td colspan="2"><strong>Total</strong></td>
                <td><strong>{{ amount_naam = amountTotal(transection_detail_naam)}}</strong></td>
              </tr>            
        </tfoot>
    </table>                        
</div>
total = {{(parseFloat(amount_sale) + parseFloat(amount_naam)) - (parseFloat(amount_jama)) }}

如果我删除if条件然后它运行良好但是如果条件它不工作并显示NaN。我认为这是一个具有相同变量名amount_sale的问题。如果可以，请你帮助我。提前致谢。

Answer 1

AngularJs没有为这样的变量赋值，它会直接显示通过amountTotal（sales_items_detail）函数返回的内容

{{amount_sale = amountTotal(sales_items_detail)}}

您应该在控制器中添加所有这些代码逻辑，并仅在双括号中使用结果变量看这个例子

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<body>

<div ng-app="myApp" ng-controller="myCtrl">


<div ng-if="obj">{{val = "wow"}}</div>
<div ng-if="obj">{{val = "how"}}</div>
<div>{{val}}</div>


</div>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {  
    $scope.obj = true;
    $scope.val ="ok";
});
</script>

</body>
</html>

AngularJS与if条件的值之和

1 个答案: