CODEWITHSUNDEEP
angularjs
user1198582
user1198582

Reputation:

trying to use ng-repeat to create ng-model bindings

I have the following function:

var app = angular.module('Hubbub-FrontEnd', []);

app.controller('DataEntryCtrl', function($scope) {
   $scope.entryFields = [
       {pHolder:'ID goes here',ngmodel:"kid"},
       {pHolder:'Description goes here',ngmodel:"desc"},
       {pHolder:'Drop Dead Date goes here',ngmodel:"ddd"}
   ];
});

This is called in the following html.

<div ng-controller="DataEntryCtrl">
      <span ng-repeat="entryField in entryFields">
            <input type="text" ng-model="{{entryField.ngmodel}}" placeholder=
"{{entryField.pHolder}}">
   </span>
   <button>Add</button>
</div>

Upvotes: 2

Views: 1968

Answers (1)

jaime
jaime

Reputation: 42031

When doing two-way data binding with the ngModel directive you don't need double curly braces {{}}. The double curly braces tell angular to evaluate an expression and print output, notice how you have to use them to display the contents of the placeholder

Here's the working version

<span ng-repeat="entryField in entryFields">
        <input type="text" 
               ng-model="entryField.ngmodel" 
               placeholder="{{entryField.pHolder}}">
</span>

http://jsfiddle.net/jaimem/A8PkC/1/

Upvotes: 2

Related Questions