0

私はこのようなことをしようとしています:

<form name="myForm" ng-controller="Ctrl">
      Value1: <input type="checkbox" ng-number="100"> <br/>
      Value2: <input type="checkbox" ng-number="250"

      add 5% to the total sum of the checked boxes: <input type="checkbox" ng-percent=".05"
     <br/>

     total value = {{how do you do this?}}
 </form>

したがって、Value1 がチェックされている場合、合計値は「100」、両方の値がチェックされている場合は「350」、または「5% を追加」もチェックされている場合は、合計値 = ({{総和}} + ({{合計}} * .05))

jQueryでこれを行うことができますが、「Angular」の方法でそれを行う方法に頭を悩ませています。

4

1 に答える 1

1

これはあなたが探しているものだと思います: http://plnkr.co/edit/WNsjwMuBw2kDBaR7PLRy?p=preview

usingのinput要素といくつかのブール値の間で双方向のバインドを行う必要があります。$scopeng-model

  <div><label><input type="checkbox" ng-model="opts.val1" /> Value 1</label></div>
  <div><label><input type="checkbox" ng-model="opts.val2" /> Value 2</label></div>
  <div><label>add 5% to the total sum of the checked boxes: <input type="checkbox" ng-model="opts.val3" /></label></div>

そしてでcontroller：

$scope.opts = {
 val1: false,
 val2: false,
 val3: false
};

次に、合計値を関数として公開し、$scope提案したように、次を使用して HTML にバインドできます{{...}}。

  <label>Total: {{ computedTotal() }}</label>

そしてコントローラーで：

$scope.computedTotal = function () {
  // You can make the values configurable as well by exposing them on the $scope
  // and binding them to input tags using ng-model
  var opts = $scope.opts;
  var total = (opts.val1 ? 100 : 0) + (opts.val2 ? 250 : 0);
  var perc = opts.val3 ? 1.05 : 1;
   return perc * total;
};
于 2013-11-03T17:48:58.897 に答える