2014-10-09 34 views
1

我的代碼是這樣的區分從舊的當前文本框的值,並在角JS顯示

<body> 
<div> 
    <table ng-app='myApp' ng-controller="MainCtrl"> 
     <thead></thead> 
     <tbody ng-repeat="prdElement in palletElement track by $index"> 
      <tr> 
       <td>{{prdElement.name}}</td> 
      </tr> 
      <tr ng-repeat="data in prdElement.Data"> 
       <td>{{data.itemId}}</td> 
       <td>{{data.shipmentId}}</td> 
       <td>{{data.itemCode}}</td> 
       <td>{{data.description}}</td> 
       <td>{{data.handlingUnit}}</td> 
       <td>{{data.weight}}</td> 
       <td>{{data.class}}</td> 
       <td>{{data.lenght}}</td> 
       <td>{{data.width}}</td> 
       <td>{{data.height}}</td> 
       <td>{{data.flag}}</td> 
       <td> 
        <input type="text" ng-model="data.quantity" placeholder=" Code" required /> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <button ng-click="newPalletItem(prdElement,$event)">Submit</button> 
       </td> 
      </tr> 
      <!--<tr id="displayitems" > 
       <td> 
        {{palletElement}} 
       </td> 

      </tr>--> 

     </tbody> 
    </table> 
</div> 

(function() { 
    angular.module('myApp', []).controller('MainCtrl', function ($scope) { 

     var counter = 0; 

     $scope.palletElement = [{ 
      name: 'Pallet 1', 
      Data: [{ 
       name: 'item 1', 
       itemId: '284307', 
       shipmentId: 'eb44f690-c97a-40e3-be2a-0449559e171a', 
       itemCode: '', 
       description: 'Bicycle parts - frame', 
       quantity: '31', 
       handlingUnit: 'CTN', 
       weight: '613.04', 
       class: '', 
       lenght: '102', 
       width: '42', 
       height: '61', 
       flag: 'P' 

      }, { 
       name: 'item 2', 
       itemId: '284308', 
       shipmentId: 'eb44f690-c97a-40e3-be2a-0449559e171a', 
       itemCode: '', 
       description: 'Bicycle parts - fork', 
       quantity: '22', 
       handlingUnit: 'CTN', 
       weight: '242.99', 
       class: '', 
       lenght: '75', 
       width: '34', 
       height: '18', 
       flag: 'P' 
      }] 
     }] 

     $scope.newPalletItem = function (palletElement, $event) { 
      counter++; 
      $scope.palletElement.push(palletElement); 
     } 

    }); 
}()); 

當有人改變了最後一欄的文本框,然後按提交按鈕,我想要的值計算[文本框中的preloded值 - (減去)該文本框中的當前值]並將其顯示在下一行中。到目前爲止,我已經設法將整個數據完全複製到下一行。但在如何達到休息方面沒有想法。任何人都可以提出解決方案。

Fiddle

更多來自小提琴細節:正如你所看到的電流值第一個文本框是31如果有一個人,當我重複行底部它改變10我想新的文本框的值是顯示爲21(即31-10)。

回答

2

請看這裏:http://jsfiddle.net/8r8cxcup/

newPalletImte:

$scope.newPalletItem = function (palletElement, $event) { 
      var npalletElement = {}; 
      angular.copy(palletElement, npalletElement); 
      counter++; 

      angular.forEach(npalletElement.Data, function (row) { 
       if (row.quantity != row.newquantity) { 
        row.quantity = row.quantity - row.newquantity; 
       } 

      }); 

      $scope.palletElement.push(npalletElement); 
     }; 

    }); 

HTML:

<table ng-app='myApp' ng-controller="MainCtrl"> 
      <thead></thead> 
      <tbody ng-repeat="prdElement in palletElement track by $index"> 
       <tr> 
        <td>{{prdElement.name}}</td> 
       </tr> 
       <tr ng-repeat="data in prdElement.Data" ng-init="data.newquantity = data.quantity"> 
        <td>{{data.itemId}}</td> 
        <td>{{data.shipmentId}}</td> 
        <td>{{data.itemCode}}</td> 
        <td>{{data.description}}</td> 
        <td>{{data.handlingUnit}}</td> 
        <td>{{data.weight}}</td> 
        <td>{{data.class}}</td> 
        <td>{{data.lenght}}</td> 
        <td>{{data.width}}</td> 
        <td>{{data.height}}</td> 
        <td>{{data.flag}}</td> 
        <td> 
         <input type="text" ng-model="data.newquantity" placeholder=" Code" required /> 
        </td> 
       </tr> 
       <tr> 
        <td> 
         <button ng-click="newPalletItem(prdElement,$event)">Submit</button> 
        </td> 
       </tr> 
       <!--<tr id="displayitems"> 
        <td> 
         {{palletElement}} 
        </td> 

       </tr>--> 
      </tbody> 
     </table> 
相關問題