2017-01-31 5 views
0

私はかなり簡単なことをしようとしています。入力フィールドのうち、ユーザータブは、私は、各番号には2つの小数点以下を含むようにその値を取り、値を変更したいときにも0.00入力はng-blurでonblurを更新しません。

I have a working plunkr

ここでHTML

<input type="text" class="form-control" only-digits ng-blur="vm.cleanNumbers(vm.order.frameInformation.A)" ng-model="vm.order.frameInformation.A"> 
です

コントローラが呼び出さ取得され、値が変更されますが、入力は決して私が値ログインしてるplunkrの変化

function cleanNumbers(value) { 
    if (value !== 0) { 
     var hasDecimal = value.indexOf('.') > -1; 
     value = value.replace('$', ''); 
     value = value.replace(/[,]+/g, ''); 
     value = parseFloat(value); 

     if (isNaN(value)) { 
      return 0; 
     } 

     value = value.toFixed(2); 
    } 
} 

を反映していません私が更新する入力が欲しいものを見ている。

答えて

0

まずAngularJS(1.6.2は現在)の最新バージョンを使用することをお勧めします。まだいくつかのバグ修正と良い変更があります。

第2に、コントローラの接頭辞 "vm"を使用していますが、コントローラバインダにその旨は言いません。あなたのindex.html(plunkr)にこの行。

<body ng-controller="test"> 

私は意図されていると信じていますか?

<body ng-controller="test as vm"> 

また、でもこれはあなたがやろうとしている実際の動作を処理していない、私はあなたが自分でそれの残りの部分を把握することができます確信しています。

+0

私は私のルータの構文としてのコントローラを使用していSNIPPET上で実行してください実際のプロジェクトはplunkr、tにそれを追加するのを忘れてしまった助けのためのハンク –

1

ここに必要な回答があります。

最初の問題は、あなたがするので、同じ値を取得している 、floatに値を変換し、テキストフィールドに表示しようとしているので文法、

ng-controller="test as vm"

としてコントローラを使用することですfloatのテキスト値はテキストと同じです。

あなたが好きなように表示するには、フロートを文字列に戻す必要があります。

ここ

改訂コードがあり、

// Code goes here 
 

 
(function() { 
 
    'use strict'; 
 

 
    angular 
 
     .module('admin', []) 
 
     .controller('test', test); 
 
     
 
     test.$inject = ['$log']; 
 

 
    function test($log) { 
 
     
 
     $log.debug('controller loaded'); 
 
     /*jshint validthis: true */ 
 
     let vm = this; 
 
     vm.order = {}; 
 
     
 
     vm.cleanNumbers = cleanNumbers; 
 
     
 
     function cleanNumbers(test) { 
 
      $log.debug(test); 
 
      let value = vm.order[test]; 
 
      if (value != 0 && value != undefined) { 
 
       var hasDecimal = value.indexOf('.') > -1; 
 
       value = value.replace('$', ''); 
 
       value = value.replace(/[,]+/g, ''); 
 
       value = parseFloat(value); 
 

 
       if (isNaN(value)) { 
 
        return 0; 
 
       } 
 

 
       //value = value.toFixed(2); 
 
       function toNumberString(num) { 
 
        return value.toString() + ".00" 
 
       } 
 
       
 
       vm.order[test] = toNumberString(value); 
 
       console.log(value); 
 
       console.log(vm.order); 
 
      } 
 
     } 
 
    } 
 
     
 
})();
<!DOCTYPE html> 
 
<html ng-app="admin"> 
 

 
    <head> 
 
    <script data-require="[email protected]" data-semver="1.5.5" src="https://code.angularjs.org/1.5.5/angular.js"></script> 
 
    <!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> 
 

 
<!-- Optional theme --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous"> 
 
    <link rel="stylesheet" href="style.css" /> 
 
    <script src="script.js"></script> 
 
    </head> 
 

 
    <body ng-controller="test as vm"> 
 
    <div class="col-md-4"> 
 
     {{vm.order}} 
 
     <div class="form-group"> 
 
     <label class="control-label">A</label> 
 
     
 
     <input type="text" class="form-control" ng-blur="vm.cleanNumbers('A')" ng-model="vm.order.A" /> 
 
     </div> 
 
    </div> 
 
    <div class="col-md-4"> 
 
     <div class="form-group"> 
 
     <label class="control-label">B</label> 
 
     <input type="text" class="form-control" ng-blur="vm.cleanNumbers('B')" ng-model="vm.order.B" /> 
 
     </div> 
 
    </div> 
 
    </body> 
 

 
</html>

HERE IS A WORKING DEMO

+0

それはいつも.00で終わるとは限りません、私はちょうど私が.toFixed(2)をした理由の2桁の小数点が欲しいと示していました。 –

+0

大丈夫ですが、入力タイプのテキストに浮動小数点値を表示することはできません。 – Sravan

関連する問題