コントロールで2つの入力間を自動変更する

Question

の2つの小数点以下の桁がの正の浮動小数点（change()関数によって削除する必要があります）を受け入れる2つの入力があります。

入力の値を変更すると、他の入力の値も自動的に変更されます。

---

問題＃1から主な問題

私の正規表現は2つの小数を超えてブロックし、severalsに.を許可していません（例：12.345.67は悲しいことに動作します）。

問題＃2

禁断の文字が正しくchange()の呼び出しで削除されません。私はreplace()は文字列のみで動作しますので、これが発生し

Error: $scope.uc.replace is not a function

取得し、数学演算子（+、-、*、/）が数字のみで動作します。私は両方を使用する必要があります、どのように対処するには？

---

これは私のコードです。自分で試してみたい場合はthis JSFiddleを使用してください。 問題＃1については

var myApp = angular.module('myApp',[]); 
 

 
function MyCtrl($scope) { 
 
    $scope.coeff = 0.5; 
 
    $scope.uf = '25'; 
 
    $scope.uc = ''; 
 
    
 
    $scope.change = function(type) { 
 
     console.log(type, "changes!"); 
 
     
 
     $scope.uf = $scope.uf.replace(',', '.'); 
 
     $scope.uf = $scope.uf.replace(/[^\d.-]/g, ''); 
 
     $scope.uc = $scope.uc.replace(',', '.'); 
 
     $scope.uc = $scope.uc.replace(/[^\d.-]/g, ''); 
 
     
 
     if(type == 'uf') { 
 
      $scope.uc = $scope.uf * $scope.coeff; 
 
     } else if(type == 'uc') { 
 
      $scope.uf = $scope.uc/$scope.coeff; 
 
     } 
 
    } 
 
}

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

 
<div ng-app="myApp" ng-controller="MyCtrl"> 
 
    <input type="text" ng-model="uf" ng-change="change('uf')"/> 
 
    <input type="text" ng-model="uc" ng-change="change('uc')"/> 
 
</div>

Answer 1

、ここでは正確に何をしたいフィルタの正規表現です：私が作った問題＃2については

$scope.uf = $scope.uf.replace(',', '.') 
        .replace(/[^\d.]/g, '') 
        .replace(/\./, "x") 
        .replace(/\./g, "") 
        .replace(/x/, "."); 

---

は、 parseFloatの計算：

$scope.uc = +parseFloat($scope.uf * $scope.coeff).toFixed(2); 
$scope.uf = +parseFloat($scope.uf = $scope.uc/$scope.coeff).toFixed(2); 

toFixed(2)は、.の後に2小数しか許されない。

angular.module('myApp').directive('floatOnly', function() { 
    return { 
     require: 'ngModel', 
     restrict: 'A', 
     link: function(scope, element, attrs, modelCtrl) { 
      modelCtrl.$parsers.push(function(inputValue) { 
       if(inputValue === undefined) return ''; 

       cleanInputValue = inputValue.replace(',', '.') 
              .replace(/[^\d.]/g, '') 
              .replace(/\./, "x") 
              .replace(/\./g, "") 
              .replace(/x/, "."); 
       if(cleanInputValue != inputValue) { 
        modelCtrl.$setViewValue(cleanInputValue); 
        modelCtrl.$render(); 
       } 
       return cleanInputValue; 
      }); 
     } 
    } 
}); 

次のようにHTMLで使用される：

<div ng-controller="MyCtrl"> 
    <input type="text" ng-model="uf" ng-change="change('uf')" float-only/> 
    <input type="text" ng-model="uc" ng-change="change('uc')" float-only/> 
</div> 

だからchange()関数は次のようになります。

---

最後に、私はディレクティブで山車をチェックするコードを置きます

$scope.change = function(type) { 
    console.log(type, "changes!"); 

    if(type == 'uf') { 
     $scope.uc = +parseFloat($scope.uf * $scope.coeff).toFixed(2); 
    } else if(type == 'uc') { 
     $scope.uf = +parseFloat($scope.uf = $scope.uc/$scope.coeff).toFixed(2); 
    } 
} 

---

Working Fiddle

Answer 2

代わりに入力タイプ=「番号」を使用することはどうですか？ http://jsfiddle.net/Lvc0u55v/7192/

<div ng-controller="MyCtrl"> 
    <input type="number" step="0.01" ng-model="uf" ng-change="change('uf')"/> 
    <input type="number" step="0.01" ng-model="uc" ng-change="change('uc')"/> 
</div> 

var myApp = angular.module('myApp',[]); 

function MyCtrl($scope) { 
    $scope.coeff = 0.5; 
    $scope.uf = "25"; 
    $scope.uc = ""; 

    $scope.change = function(type) { 
     console.log(type, "changes!"); 

     if(type == 'uf') { 
      $scope.uc = $scope.uf * $scope.coeff; 
     } else if(type == 'uc') { 
      $scope.uf = $scope.uc/$scope.coeff; 
       } 
    } 
}