尝试使用ng-repeat来创建ng-model绑定

时间:2012-12-03 21:28:56

标签: angularjs

我有以下功能:

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"}
   ];
});

在以下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>

1 个答案:

答案 0 :(得分:3)

使用ngModel指令进行双向数据绑定时,不需要双花括号{{}}。双花括号告诉angular来评估表达式和打印输出,注意你必须如何使用它们来显示占位符的内容

这是工作版

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

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