Десятичный ввод угловойJS: изменение запятой на точку

Ответ 1

Я боюсь, что я не знаком с FCSA number: (

Однако, если ваша цель - понять, как реализовать простое, angular -ориентированное решение, которое может удовлетворить ваши потребности, читайте далее... Ниже вы найдете директиву price, реализованную в плункере. Это довольно просто, и я рекомендую вам потратить время на его изучение, а затем реализовать свое собственное решение, вдохновленное директивой price и исходным кодом FCSA.

• a filter для преобразования чисел запятой в десятичные числа:

  app.filter('comma2decimal', [
  function() { // should be altered to suit your needs
      return function(input) {
      var ret=(input)?input.toString().trim().replace(",","."):null;
          return parseFloat(ret);
      };
  }]);
  

Этот фильтр автоматически преобразует данные из формата представления (с запятой) в формат модели (ваша область с десятичной точкой).

2. a filter для преобразования десятичных чисел в номера запятой:

   app.filter('decimal2comma', [
   function() {// should be altered to suit your needs
       return function(input) {
           var ret=(input)?input.toString().replace(".",","):null;
           if(ret){
               var decArr=ret.split(",");
               if(decArr.length>1){
                   var dec=decArr[1].length;
                   if(dec===1){ret+="0";}
               }//this is to show prices like 12,20 and not 12,2
           }
           return ret;
       };
   }]);
   

Этот фильтр автоматически преобразует данные из формата модели (ваша область с десятичной) для просмотра формата (ваш вид с запятой).

3. a directive с именем цена, который использует эти два фильтра:

   app.directive('price', ['$filter',
   function($filter) {
   return {
       restrict:'A',
       require: 'ngModel',
       link: function(scope, element, attrs, ngModelController) {
           ngModelController.$parsers.push(function(data) {
               //convert data from view format to model format
   
               data=$filter('comma2decimal')(data);
   
               return data;
           });
   
           ngModelController.$formatters.push(function(data) {
               //convert data from model format to view format
   
               data=$filter('decimal2comma')(data);
   
               return data;
           });
       }
   };}]);
   

   ---

Смотрите этот рабочий плункер, показывая, как все работает вместе.

Изначально число (например, поступающее из базы данных) имеет десятичное значение в области контроллера ($ scope.price = 25.36;);

В представлении это выглядит так: 25,36 на входе и 25.36, как в базе данных ниже.

Теперь введите любой номер запятой: он автоматически преобразуется в десятичное число для вставки в базу данных.

Надеемся, что это ответит на ваш вопрос.

Преимущество использования директивы: оно многократно используется везде, где оно вам нужно на вашем веб-сайте.

Преимущество использования двух фильтров: разделение проблем.

Этот подход позволяет пользователям использовать номера, которые они наиболее часто используют в ваших представлениях. Однако введенные числа могут быть изменены в фоновом режиме перед вставкой в ​​базу данных, поэтому они отформатированы правильно.

И когда вы выбираете цены/цифры из базы данных, они автоматически изменяются, прежде чем показывать их в виде, наиболее подходящем для читателя.

Если вам нужны другие параметры, например, в директиве FCSA Number, вы можете легко добавить их в свои фильтры.

Вам, вероятно, понадобятся пользовательские функции и проверка модели, используя ngModelCtrl.$setValidity.

Ответ 2

Добавьте свой язык:

<script type="application/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-i18n/1.5.0/angular-locale_en-us.min.js"></script>

Вы можете проверить список доступных локалей здесь: https://cdnjs.com/libraries/angular-i18n

Ответ 3

Я использовал неортодоксальное решение. В .js Angular я искал "DECIMAL_SEP" и менял:

DECIMAL_SEP:".",GROUP_SEP:","

к

DECIMAL_SEP:",",GROUP_SEP:"."

И это работает! это не лучшее решение, но оно работает... Я просто хочу помочь.

PS. Я из Колумбии, извините, если мой английский плохой.

Ответ 4

Более короткий путь:

app.filter('commaToDecimal', function(){
    return function(value) {
        return value ? parseFloat(value).toFixed(2).toString().replace('.', ',') : null;
    };
});

Ответ 5

Решение:

.filter('dot2comma', [
  function() {
    return function(value) {
      return value.toString().replace(/\./g,',');
    };
  }]);

Ответ 6

Вам просто нужно использовать фильтр angular number и изменить angular разделитель по умолчанию и групповые символы.

app.run(["$locale", function ($locale) {
    $locale.NUMBER_FORMATS.GROUP_SEP = " ";
    $locale.NUMBER_FORMATS.DECIMAL_SEP = ".";
}]);