2017-07-22 9 views
0

私はionic1アプリケーションと3つの入力を持っています。Ionic1 VAT計算

<label class="item item-input item-stacked-label"> 
     <div class="input-label"> 
      Total (Inc VAT) £ 
     </div> 
     <input type="number" ng-model="form.gross" placeholder="Total Including VAT"> 
     </label> 
     <label class="item item-input item-select"> 
     <div class="input-label"> 
      VAT Value 
     </div> 
     <select ng-model="form.vat"> 
      <option value="20" selected="">20%</option> 
      <option value="0">0%</option> 
      <option value="5">5%</option> 
     </select> 
     </label> 
     <label class="item item-input item-stacked-label"> 
     <div class="input-label"> 
      Amount (Ex VAT) £ 
     </div> 
     <input type="number" ng-model="form.net" placeholder="Total Including VAT"> 
     </label> 
  • form.gross form.net

form.vat私はネット値をうまくいくグロスへの入力に基づいて計算をしようとしていますVAT値%に基づいています。

最初の問題 - 私は決して選択された選択されたオプションを得ることができません。 第二の問題 - 私のコントローラにネット値の計算は更新doesn'nt

アプリケーションをバインド2の方法にして、更新された値に基づいて変化するであろうため、私は思っ

$scope.form.gross = 0; 
$scope.form.vat = 20; 
$scope.form.vatValue = $scope.form.gross/100 * $scope.form.vat; 
$scope.form.net = $scope.form.gross - $scope.form.vatValue; 

コントローラドーム?

答えて

1

第1の問題:ng-option &には、選択のために値&のラベルを含むオブジェクトの配列があります。あなたは&が、代わりにオプションのselected=''属性を使用しての選択だけで、従来のを使用することを使用したくない場合は、同じように、値として

$scope.form.vat= 20;

(使用番号のようなコントローラ内部のそのフィールドの値を初期化しますとにかくそれらの算術演算を実行しています)

2番目の問題については、グロス&のフィールドにng-changeディレクティブがあり、内部ではvatvalueを見つけるための操作を呼び出します& net。したがって、入力条件を変更するたびに計算されます。現在、初期条件では1回しか発生していません。したがって、あなたの関数は次のようになります:

$scope.changed = function(){ 
    $scope.form.vatValue = $scope.form.gross/100 * $scope.form.vat; 
    $scope.form.net = $scope.form.gross - $scope.form.vatValue; 
} 

ng-change="changed()"これは、両方の入力フィールド(グロス、バット)で行います。

ここで動作するコード例はhttps://codepen.io/anon/pen/LjPmmx?editors=1010です。 これで、 'net'の入力フィールドが操作されているので、それを操作したいと思うかもしれません。同じように、定数値を使って総額を計算する別の関数を書いています。&正味値を変更し、ネットフィールド。

関連する問題