美元到美分和回Angular JS

我試圖能夠鍵入美元金額（5.75）並將其轉換爲575並存儲在數據庫中，然後再次在網站上顯示爲5.75。美元到美分和回Angular JS

我的工作價格爲5.00美元，但不適用於5.75美元。我擁有的是以下。

HTML

<input type="number" class="form-control" ng-model="admin.singleInfo.pricing.cost" monetary-input ng-change="admin.calculateSell(admin.singleInfo.$id); admin.singleInfo.$save();changesSaved()"/>

FILTER

.filter('MonetaryUnit', function() { 
    return function (amount) { 
     return (amount/100).toFixed(2); 
    } 
})

DIRECTIVE

directive('monetaryInput', function($filter, $browser) { 
    return { 
     require: 'ngModel', 
     link: function($scope, $element, $attra, ngModelCtrl) { 
      var listener = function() { 
       $element.val($filter('MonetaryUnit')(value, false)); 
      }; 

      ngModelCtrl.$parsers.push(function(viewValue) { 
       return Math.round(parseInt(viewValue) * 100); 
      }); 

      ngModelCtrl.$render = function() { 
       $element.val($filter('MonetaryUnit')(ngModelCtrl.$viewValue, false)); 
      } 

      $element.bind('change', listener); 
     } 
    } 
})

來源

2016-07-22 Mitch Evans

所以沒有答案意味着它應該是工作？ –

5.75你會得到什麼答案？你有沒有嘗試使用parseFloat而不是parseInt？ – heliotrope

很簡單。只需將parseInt更改爲parseFloat即可。請參見下面的工作示例：

var app = angular.module("sa", []); 
 

 
app.controller("FooController", function($scope) { 
 

 
}); 
 

 
app.filter('MonetaryUnit', function() { 
 
    return function(amount) { 
 
    return (amount/100).toFixed(2); 
 
    } 
 
}); 
 

 
app.directive('monetaryInput', function($filter, $browser) { 
 
    return { 
 
    require: 'ngModel', 
 
    link: function($scope, $element, $attra, ngModelCtrl) { 
 
     var listener = function() { 
 
     $element.val($filter('MonetaryUnit')(value, false)); 
 
     }; 
 

 
     ngModelCtrl.$parsers.push(function(viewValue) { 
 
     return Math.round(parseFloat(viewValue) * 100); 
 
     }); 
 

 
     ngModelCtrl.$render = function() { 
 
     $element.val($filter('MonetaryUnit')(ngModelCtrl.$viewValue, false)); 
 
     } 
 

 
     $element.bind('change', listener); 
 
    } 
 
    } 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 

 
<div ng-app="sa" ng-controller="FooController"> 
 
    <input type="text" ng-model="amount" monetary-input /> 
 

 
    <br>Model value: {{amount}} 
 
</div>

來源

2016-07-23 04:42:29

美元到美分和回Angular JS

回答

相關問題