AngularJS：頁面顯示NaN並從服務器獲取數據。如何預防它？

Question

考慮這個電腦板

$scope.transaction = {}; 
    $scope.transactions = Transaction.query(); 

    $scope.save = function() { 
    var transaction = new Transaction(); 
    transaction.name = $scope.transaction['name']; 
    transaction.debit = $scope.transaction['debit']; 
    transaction.date = $scope.transaction['date']; 
    transaction.amount = $scope.transaction['amount']; 
    transaction.category = $scope.transaction['category'].uuid; 

    //noinspection JSUnresolvedFunction 
    transaction.$save(); 
    $scope.transactions.push(transaction); 
    console.log('transaction saved successfully', transaction); 
    }; 

這HTML

<tbody ng-repeat="transaction in transactions | orderBy: transaction.created_on"> 
     <td>{{ transaction.name }}</td> 
     <td>{{ transaction.amount | currency }}</td> 
     <!-- custom filter to display type of transaction --> 
     <td>{{ transaction.debit | transactionType }}</td> 
     <!-- added dateInMillis to pass to date to filter Angular way --> 
     <td>{{ transaction.created_on | dateInMillis | date: 'medium'}}</td> 
     <td>{{ transaction.category.name }}</td> 
     <td> 
</tbody> 

問題
當我加入交易，就立即顯示一堆NaNs，然後一旦服務器與存儲的數據回來，它將NaNs替換爲實際數據

Ho我可以防止這種情況發生嗎？它不是很好UX

Answer 1

沒有看到所有與Transaction對象有關的代碼，它很難確切地知道問題是什麼。一目瞭然，我認爲你需要一個附加到transaction.$save()方法的回調函數。

transaction.$save(function(u, putResponseHeaders) { 
    // This is $save's success callback 
    $scope.transactions.push(transaction); 
    console.log('transaction saved successfully', transaction); 
});