How Can I Concatinate A Ng-model Value With A Value From A Ng-repeat

I want to loop through an array of objects that I receive from a REST service and create a dynamic form using the ng-repeat directive. This is my form with a rating directive (tak

Solution 1:

ng-model takes a variable, not a string value. I'm not sure what exactly you're trying to do but I would think it would be something like:

ng-model="catRatings[cats.id]"

However, I am not familiar with that directive so I'm not sure if it accepts a ng-model attribute.

Solution 2:

I have created an example that will be referenced throughout the post. The following variables are declared within the scope as follows.

$scope.data = [
  {
    'id' : 0,
    'name' : 'Tim'
  },
  {
    'id' : 1,
    'name' : 'John'
  }
];
$scope.ratings = [ '5 stars', '2 stars' ];

When you are setting your model to 'catRatings' + {{ cats.id }} that means somewhere you are declaring a $scope.catRatings1, $scope.catRatings2, etc. Instead you should bind directly the the category object as follows.

<label ng-repeat="person in data">
  <inputtype="text" ng-model="person.name">
  ...
</label>

or bind to an array with a corresponding index

<label ng-repeat="person in data">
  ...
  <input type="text" ng-model="ratings[$index]">
</label> 

or bind to an array using the id...

<label ng-repeat="person in data">
  ...
  <inputtype="text" ng-model="ratings[person.id]">
</label>