javascript - 单击 View 中的项目时定位 JSON 文件中的子对象 - AngularJS

Question

好的，所以我的问题是我认为进行了以下设置:

<a class="like" ng-tap="likeClicked()"><span>{{isLiked}}</span></a>

此外，我还有另一个重要的 View 元素:

<span class="like-count" ng-tap="viewLikes()" ng-init="likeCount=feed.likes.length"{{likeCount}}</span>

然后是我的 Controller ，我有以下代码:

$scope.likeClicked = function () {

    console.log($scope.feeds);

    if (!hasLiked) {
      hasLiked = true;
      $scope.isLiked = 'Unlike';
    } else {
      hasLiked = false;
      $scope.isLiked = 'Like';         
    }
  };

最后，一些虚拟的 JSON:

  {
    "id":5,
    "title":"Feed 1",
    "createdby":1,
    "typeId":2,
    "content":"Lorem ipsum dolor sit amet, consectetur adipisicing elit,",
    "createdon":"2013-03-21 14:53:35",
    "editedon":"2013-03-21 14:53:35",
    "comments": [
      {
        "id": 0,
        "createdby": 5,
        "content": "Lorem ipsum dolor sit amet, consectetur adipisicing elit,",
        "createdon":"2013-03-21 14:53:35"
      }
    ],
    "likes": [
      {
        "id": 11,
        "createdby": 4,
        "createdon":"2013-03-21 14:53:35"
      },
      {
        "id": 13,
        "createdby": 2,
        "createdon":"2013-03-21 14:53:35"
      }
    ]
  }

我想要实现的目标是，当用户点击 likeClicked 时，“喜欢”被喜欢(尽管这一点有效)。然后一旦喜欢我需要得到 .length与该 feed 项目关联的 JSON 子级中的数组的名称。问题来了，我可以使用控制台日志使用console.log($scope.feeds);返回控制台中的对象。 ，但是，如果我使用 console.log($scope.feeds.likes); ，这会返回 undefined，即使它是数组和 $scope 中的可用对象。被点击元素的。

我不想做的是指定 JSON 的特定子项 console.log($scope.feeds[3});例如，因为如果我可以根据ng-repeat中的项目动态设置子项会更好。即被点击。

任何 Angular 坏蛋，请帮忙!

谢谢

日本

Answer 1

要定位提要的单个实例，您可以使用 ng-repeat 公开的属性 $index 并将其传递给 likeClicked() 方法。

<article ng-repeat="feed in feeds">
    <h3>{{feed.createdby}}</h3>
    <p>{{feed.content}}</p>
    <button ng-click="likeClicked($index)">{{isLiked}}</button>
</article> 

知道索引后，您可以单独跟踪每个提要/喜欢，举个例子，我创建了一个对象(isLiked)来保存此数据。

要更改按钮的文本，我将使用一个基于 isLike 对象中存储的值的过滤器。

这是一个笨蛋 http://plnkr.co/edit/OJmSFIppizpTtUiOcqxD?p=preview