使用 ngclick 编辑 ng-repeated 项目

Question

我正在学习 Angular，并且正在尝试构建一些零碎的东西来学习。我试图在下面尽可能清楚地解释自己 - 任何帮助将不胜感激。

示例： http://jsbin.com/micasafetise/2/ http://jsbin.com/micasafetise/2/edit?html,js,console,output

我自己创建了这些数据

$scope.people = 
[
    {
    "personID": 1,
    "first_name": "Sam",
    "last_name": "Stimpson",
    "attending": false
    },
    {
    "personID": 2,
    "first_name": "Alison",
    "last_name": "van Schoor",
    "attending": true
    },
    {
    "personID": 3,
    "first_name": "Lindsay",
    "last_name": "van Schoor",
    "attending": false
    }
];

我在我的视图中创建了这样的输出：

<div ng-repeat="person in people">
  <a href="" ng-click="isAttending()">
    {{person.first_name}}{{person.last_name}} - {{person.attending}}
  </a>
</div>

现在我被困住了。我希望能够单击一个人并将其参加字段从 false 更新为 true。我知道我可以像这样使用 ng-click

$scope.isAttending = function() {
   alert("is attending");
};

但不知道如何更新我点击的人以在 $scope.people 中将 false 更改为 true。

当我实现这一点时，我计划再进行一次带有过滤器的 ng-repeat，以向参加者展示，但我相信我能够做到这一点。

任何人都可以帮助我或给我一些建议，目前任何事情都会非常感激。

提前致谢。

我写了一个我在这里尝试做的例子： http://jsbin.com/micasafetise/2/ http://jsbin.com/micasafetise/2/edit?html,js,console,output

Answer 1

您可以只传递重复的人<a href="" ng-click="isAttending(person)"> 并让您的处理程序方法获取该对象，因此您可以更新其属性（您也可以在视图中内联执行此操作，但最好分开放置控制器中的逻辑，就像你最初拥有的那样）。

$scope.isAttending = function(person) {
  person.attending = true;
};

只需在两个部分都添加一个过滤器，以显示谁都参加了，谁没有参加。

<div ng-repeat="person in people | filter:{attending:false} track by person.personID">
  <a href="" ng-click="toggleAttending(person)">
    {{person.first_name}}{{person.last_name}} - {{person.attending}}
  </a>
</div>

和

$scope.toggleAttending = function(person) {
  person.attending = !person.attending;
};

Demo

在您的情况下，您可以通过从控制器中过滤并填充到 people.invited 和 people.attendance 的 2 个人员列表来更好地优化（您在同一人员列表上有 2 个过滤器）。

function updatePeopleAttendance(){
  $scope.people.attending = [];
  $scope.people.invited = [];

 angular.forEach(people, function(person){
   $scope.people[person.attending ? 'attending' : 'invited'].push(person);
 });
}

Demo

或者更好的是，您可以在方法中传递 id、索引和状态，然后将项目从一个数组中拉出并推送到另一个数组。