AngularJS - およびAngularJSによって処理しながら、テーブルの行によって指令行

Iは、PHPを介してテーブルgeneretadを有する：もちろんAngularJS - およびAngularJSによって処理しながら、テーブルの行によって指令行

<table> 
    <tr> 
    <th>Col 1</th> 
    <th>Col 2</th> 
    <th>Col 3</th> 
    </tr> 


    <?php 
     while(...){ 
    ?> 
     <tr> 
      <td> 
      <input type="text" ng-model="calcolo.ore"> 
      </td> 
      <td> 
      <input type="text" ng-model="calcolo.ricavo"> 
      </td> 
      <td> 
      <input type="text" ng-model="calcolo.abbatt"> 
      </td> 
      <td> 
      <input type='text' ng-show="calcolo.abbatt" value='{{netti() | currency:"&euro;"}}'> 
      </td> 

     </tr> 

    <?php } ?>

angular.module("myApp", ['ng-currency']) 
    .controller("userController", 
     function($scope) { 

      $scope.fattlord = function() { 
       return ($scope.calcolo.ore * $scope.calcolo.ricavo) 
      }; 


      $scope.netti = function() { 
       return ($scope.calcolo.ricavo-(($scope.calcolo.abbatt * $scope.calcolo.ricavo)/100)) 
      }; 


     });

、Iは、テキスト入力に書き込む場合、同じngモデルのすべての入力が同じ値を取得します。

IDを持つAngularの方法がありますか？他のものを変更せずに行ごとにコンパイルできますか？

ご迷惑をおかけして申し訳ありません、ありがとうございます！

PS：ng-repeatは使用できません。

出典

2016-11-15 L. Soprano

あなたは指令（[ドキュメント]（https://docs.angularjs.org/guide/directive）） – gianlucatursi

を作成したり、各ためのコントローラを定義する必要があります。そして、それぞれのtrは異なるスコープを持つでしょう。 – yBrodsky

"同じng-modelを持つすべての入力が同じ値を取得します" - >これが起こるはずです。あなたのコードでは、ngモデルはすべて異なっています。達成したい行動を明確にすることはできますか？ – elfan

@yBrodskyはコメントに記載されているとおり、<tr>のコントローラーを使用しているため、<tr>ごとに異なるスコープを持つことができます。その後ng-model="calcolo[0].abbatt"、ng-model="calcolo[1].abbatt"など

コントローラ内で使用すると、calcolo配列をループを行うことができます

<script data-require="[email protected]*" data-semver="1.5.2" src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.2/angular.js"</script> 
<body data-ng-app="myApp"> 
<table> 
    <tr> 
     <th>Col 1</th> 
     <th>Col 2</th> 
     <th>Col 3</th> 
    </tr> 
    <?php 
     $i = 0; 
     while($i++ < 5){ 
    ?> 
    <tr data-ng-controller="userController"> 
     <td> 
      <input type="text" ng-model="calcolo.ore"> 
     </td> 
     <td> 
      <input type="text" ng-model="calcolo.ricavo"> 
     </td> 
     <td> 
      <input type="text" ng-model="calcolo.abbatt"> 
     </td> 
     <td> 
      <input type='text' ng-show="calcolo.abbatt" value='{{netti() | currency:"&euro;"}}'> 
     </td> 
    </tr> 
    <?php } ?> 
</table> 
<script> 
    angular.module("myApp", []) 
    .controller("userController", 
     function($scope) { 
      $scope.calcolo = {}; //init 

      $scope.fattlord = function() { 
       return ($scope.calcolo.ore * $scope.calcolo.ricavo) 
      }; 
      $scope.netti = function() { 
       return ($scope.calcolo.ricavo-(($scope.calcolo.abbatt * $scope.calcolo.ricavo)/100)) 
      }; 
     } 
     ); 
</script> 
</body>

出典

2016-11-18 07:36:21 elfan

あなたはcalcoloのための配列を使用してPHPの行ごとにインデックスを増加させる可能性があります。

出典

2016-11-18 07:47:58

AngularJS - およびAngularJSによって処理しながら、テーブルの行によって指令行

答えて

関連する問題