带输入的角度ng重复

时间:2013-12-13 00:37:37

标签: javascript angularjs

我有这样的观点:

<table class="table">
   <tr data-ng-repeat="exercise in exercises x">
      <td>
           <input type="number" data-ng-model="?????????" />
       </td>
        <td>
           {{exercise.Name}}
        </td>
     </tr>
  </table>

我想知道我应该把data-ng-model放在哪里,这样我就可以在我的控制器中使用双向数据绑定,即输入值?

我已尝试data-ng-model="{{exercise.Name}}",但这导致了错误。

另外,如何在控制器中引用某些输入?我可以这样做:$scope.InputOne = ...

2 个答案:

答案 0 :(得分:5)

使用data-ng-model="exercise.Name"而不使用{{}}括号。

我建议你从angular tutorial开始。

答案 1 :(得分:2)

用于双向绑定使用ng-model,单向绑定使用ng-bind或{{}}括号。

这个example演示了如何使用这两种方式以及如何获取对象的信息。

ps:控制器不应直接“看到”视图。

<body data-ng-app="app">
 <div data-ng-controller="TestCtrl">
  <table>
    <tbody>
      <tr data-ng-repeat="exercise in exercises">
        <td>
           <input type="number" data-ng-model="exercise.Name" />
        </td>
        <td data-ng-bind="exercise.Name"></td>
        <td><button data-ng-click="getInformation($index)">Get information</button></td>
      </tr>
    </tbody>
  </table>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.4/angular.min.js"></script>

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

app.controller('TestCtrl', function($scope) {

$scope.exercises = [{Name:1},
                    {Name:2},
                    {Name:3},
                    {Name:4}
];

$scope.getInformation = function(index) {
  alert($scope.exercises[index].Name);
}        
});