如何在Angular Meteor中从动态形式中获取数据

我想从一个非常简单的动态表单中获取数据，我需要您的帮助。我的基本表单（当我开始工作时会升级）是这样的。

HTML:

<form class="new-task">
    <li ng-repeat="user in party.invited">
        {{user.email}}: <input ng-model="newTask">
    </li>
    <button ng-click="addTask(newTask);">ADD</button>
</form>

基本上，它为我选择的团队中的每个用户创建了一个输入字段。现在我想得到所有这些输入字段中的所有数据。这是我迷路的地方。。。

我试着在控制台中记录一些东西，但总是"未定义"。

JS:

angular.module("testapp").controller("TaskCtrl", ['$scope', '$stateParams', '$meteor',
  function ($scope, $stateParams, $meteor) {
    $scope.party = $meteor.object(Parties,$stateParams.partyId).subscribe('parties');   
    $scope.addTask = function (newTask) {
        console.log(newTask);
    };
}]);

据我所知，您希望将多个输入字段绑定到一个单独的数组。如果是这种情况，则需要在scope中创建一个空数组，然后使用tasks[$index]引用ng-model属性中ng-repeat指令内的数组元素。通过这种方式，您将能够通过访问tasks数组来检索所有输入。由于您希望一次访问所有数组元素，因此不需要向addTask函数传递newTask参数。

var myApp = angular.module('myApp', []);
function MyCtrl($scope) {
  $scope.party = {
    "invited": [{
      "email": "a@mail.com"
    }, {
      "email": "b@mail.com"
    }]
  };
  $scope.tasks = [];
  $scope.addTask = function() {
    console.log($scope.tasks);
  };
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="myApp">
  <div ng-controller="MyCtrl">
    <form class="new-task">
      <li ng-repeat="user in party.invited">
        {{user.email}}:
        <input ng-model="tasks[$index]" />
      </li>
      <button ng-click="addTask()">ADD</button>
    </form>
  </div>
</body>

相关内容

最新更新

热门标签：