I have a table generetad via PHP while and handled by 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:"€"}}'>
</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))
};
});
Of course, when I write into a text input, all the the inputs with same ng-model get the same value.
Is there a way in Angular, maybe with IDs, that allows me compiling row by row, without change the others?
Sorry for bad english and thank you!
PS: I can't use ng-repeat.
As @yBrodsky mentioned in the comment, use the controller on each <tr>
, so you can have different scope for each <tr>
.
<script data-require="angular.js.1.3@*" 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:"€"}}'>
</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>
You could use an array for calcolo
and increase the index for each row in PHP: ng-model="calcolo[0].abbatt"
, ng-model="calcolo[1].abbatt"
etc.
Then in your controller you can loop over the calcolo array.