如何在动态添加的数组中有不同的值

Question

我有一个表格，我正在通过该表格添加一些字段，例如 姓名、年龄、性别

<html>
<body>
  <form>
    <input type="text" ng-model="name">
    <input type="text" ng-model="age">
    <input type="text" ng-model="sex">
    <input type="button" value="add" ng-click="addToArray()">
  </form>
  <div ng-repeat="item in formdata">
    <input type="text" ng-model="item.name">
    <input type="text" ng-model="item.age">
    <input type="text" ng-model="item.sex">
  </div>
</body>
</html>

在控制器中

app.controller('ExampleCtrl', function() {
  var formdata = [];

  $scope.addToArray = function() {
    var temp = {
      name: $scope.name,
      age: $scope.age,
      sex: $scope.sex
    }
    formdata.push(temp);
  }
});

现在的问题是，当我将对象添加到 formdata 数组并使用 ng-repeat 显示它时，它显示每个对象的相同数据。

例如：

如果我输入 "John",23,"Male" & "Medona",34,"Female"

显示"Medona",34,"Female"两次次

我希望每个对象都有不同的属性值。

Answer 1

将 var formdata 更新为 $scope.formdata:

$scope.formdata = [];

$scope.addToArray = function() {
  var temp = {
    name: $scope.name,
    age: $scope.age,
    sex: $scope.sex
  }
  $scope.formdata.push(temp);
}

Answer 2

你应该在你的控制器中使用 $scope

app.controller('ExampleCtrl',function($scope){
    $scope.formdata=[];

    $scope.addToArray=function(){
        var temp={
            name:$scope.name,
            age:$scope.age,
            sex:$scope.sex
        }
        $scope.formdata.push(temp);
    };
});

或者您可以使用 'this' 和您的控制器名称或别名。

    <html>
        <body ng-controller="ExampleCtrl as ctrl">
            <form>
                <input type="text" ng-model="name">
                <input type="text" ng-model="age">
                <input type="text" ng-model="sex">
                <input type="button" value="add" ng-click="ctrl.addToArray()">
            </form>
           <div ng-repeat="item in formdata">
               <input type="text" ng-model="item.name">
               <input type="text" ng-model="item.age">
               <input type="text" ng-model="item.sex">
           </div>
        </body>
    </html>


app.controller('ExampleCtrl',function(){
    var self = this;
    self.formdata=[];

    self.addToArray=function(){
        var temp={
            name:Petter,
            age:25,
            sex:'Male'
        }
        self.formdata.push(temp);
    };
});

这是Plunker

如何在动态添加的数组中有不同的值

How to have different values in dynamically added array

javascript

arrays

dynamic-arrays

angularjs