入力フィールドの角表示フォーマット番号

Question

人。 は、私は、入力フィールドがあります。

<input type="number" name="price" ng-model="ctrl.form.price" required> 

問題は、いつでもユーザーの種類の数字が自動的にそれをフォーマットしていることです。 例：5 312 000.12313 ただし、ユーザーがこのフォームを送信すると、ctrl.form.priceの値は5312000.12313になります。 私はフィルタがあることを知っていますが、私が知っているように、一方向のデータバインディングのためだけに使用できます。 これを行う方法はありますか？

Answer 1

パーサとフォーマッタを使用してディレクティブを作成する必要があります。パーサ関数は、表示された値をスペースで数値に変換し、フォーマッタ関数は数値を表示されたテキストに変換します。

ような何か：

angular.module('app').directive('formattedNumber', formattedNumber); 

function formattedNumber() { 
    var directive = { 
     restrict: 'A', 
     require 'ngModel', 
     link: link 
    }; 
    return directive; 

    function link(scope, element, attrs, ngModelController) { 
     ngModelController.$parsers.push(parseNumber); 
     ngModelController.$formatters.push(formatNumber); 
    } 

    function parseNumber(viewValue) { 
     // convert text with spaces to number and return it. 
    } 
    function formatNumber(modelValue) { 
     // convert numeric modelValue to formatted text and return it. 
    } 
} 

それからちょうど：

<input type="number" name="price" ng-model="ctrl.form.price" 
    formatted-number required>