添加文本框的數字給人錯誤的結果

我創建一個web應用程序中，我有我的$scope可變添加文本框的數字給人錯誤的結果

$scope.total=20;

一個號碼，我有一個文本框

<input type="text" ng-model="amount1" ng-change="amountchange(amount1)" />

當用戶在文本框中輸入500應該是700，但相反，答案是755，當我從我的文本框中刪除500時，它變成了null。

我只想補充或從我的文本框，我在做什麼錯在這裏刪除

下面是我要更好地理解

來源

2016-12-10 Mumbai Wadala

不明白什麼是期望？ –

在輸入的每個數字上，更新'$ scope.total'值。例如：輸入500時，先輸入「5 + 200」，然後輸入「50 + 205」，然後輸入「500 + 255」。檢查控制檯[**這裏**]（https://jsfiddle.net/tusharj/XNVj3/2245/） – Tushar

順便說一句，你不需要'amount1'到'amountchange（）'。 – Tushar

這是因爲NG-變化的，每次值創建一個fiddle被獲取添加在進入500，

第一步 5 + 200 第二步 50 + 205 小號tep3 500 + 255

，所以它變成755使用ng-blur代替NG-變化

<body data-ng-controller="myController"> 
    <input type="text" ng-model="amount1" ng-blur="amountchange()" /> 
{{total}} 
    </body>

DEMO

來源

2016-12-10 12:00:20 Sajeetharan

@Tushar我已經添加了解釋 – Sajeetharan

但仍然值爲空而不是200如果我從文本框中刪除 –

@MumbaiWadala檢查更新，它會發生if金額1爲空http://jsfiddle.net/sajeetharan/9uwvcxmg/3/ – Sajeetharan

這個問題是在這條線：

$scope.total = parseInt($scope.amount1) + parseInt($scope.total);

當你合計你的價值輸入更多的輸入，而不是播種結果。

你可以做的很簡單，添加這個方法：

$scope.getTotal=function(){ 
    return parseInt($scope.amount1) + parseInt($scope.total); 
}

和替換{{total}}與此：{{getTotal()}}

來源

2016-12-10 12:06:04

在您的應用程序會發生什麼實際的預期，因爲你每添加當前數量輸入變化。

更改爲ng-blur或在更新值之前設置超時，使用內置的ng-model-options（現在可以在Angular 1.6（昨天發佈）中完成）可能是不錯的選擇。

<input type="text" ng-model="amount1" ng-change="amountchange()" ng-model-options="{'debounce':{'default':300}}" />

或：

<input type="text" ng-model="amount1" ng-blur="amountchange()" />

不過，我不建議他們要麼，和這裏的原因：

不讓當他們進入了數據提交的用戶決定（例如：按enter或一個提交按鈕），你會使用戶不友好，並引入不需要的行爲，例如當用戶在第二個示例中點擊和關閉時，該號碼將被一次又一次地添加...

考慮使用表單和ng-submit，因爲它更乾淨，更具語義性，同時也爲您的用戶提供更友好的方式來提交數據。

而且這裏的解決方案，你的其他問題：

$scope.amountchange = function() { 
     var amount = ($scope.amount1 != '') ? $scope.amount1 : 0; 
     console.log(amount) 
     if (amount != NaN) { 
      $scope.total = parseInt(amount) + parseInt($scope.total); 
     } 
     else { 
      alert("Please enter a number."); 
      $scope.amount1 = $scope.total; 
     } 
}

爲了解釋：首先，你沒有使用任何參數，因此你不需要到amount1模型的價值傳遞到函數中的指示。但那不是問題。將其設置爲空的原因是空字段不會解析爲0，因此您必須自行設置它。我將該值保存到該函數的變量amount中，並且如果值恰好爲空，則將值賦值爲$scope.amount或0。

來源

2016-12-10 12:25:58

添加文本框的數字給人錯誤的結果

回答

相關問題