为特定索引增加角度的limitTo答案

【问题标题】：increase limitTo in angular for particular index为特定索引增加角度的limitTo
【发布时间】：2015-06-10 09:05:15
【问题描述】：

我正在使用 ng-repeat 显示列表，并为所有元素设置了 limitTo。如果用户单击阅读更多按钮，那么我想增加该特定索引的 limitTo 。问题是它改变了 ng-repeat 中所有元素的 limitTo 值。如何通过 $index 来处理特定元素，有什么帮助吗？

例如

<div class="review-story" ng-repeat="review in reviews">
    {{review.story | limitTo:numLimit}}
    <a class="readmore" ng-click="readMore($index)">read more...</a>
</div>

JS：

$scope.numLimit = 50;
$scope.readMore = function (index) {
    if ($scope.numLimit == 50) {
        $scope.numLimit = 10000;
        $('.readmore').html("read less");
    }
    else {
        $('.readmore').html("read more...");
        $scope.numLimit = 50;
    }  
};

【问题讨论】：

显示你尝试过的一些相关代码
@NewDev：我已经更新了帖子。当我使用 $scope.numLimit[index] 它不起作用。有什么解决办法吗？

标签： angularjs angularjs-ng-repeat

【解决方案1】：

这是一种将限制存储在数据对象中的解决方案。您可能不想这样做，但您的解决方案是将范围映射审查中的一些数据存储到限制数量上。

http://plnkr.co/edit/spVkTCYZaBpZtQgAjrNi?p=preview

  $scope.reviews = [
    {
      story: 'this is the first story'
    },
    {
      story: 'this is the second story'
    },
    {
      story: 'this is the third story and it is longer than 30 characters'
    },
    {
      story: 'this is the fourth story and it is longer than 30 characters'
    }
  ];
  $scope.increaseLimit = function(review) {
    if (review.limit) {
      review.limit += 10;
    }
    else {
      review.limit = 40;
    }
  }

模板：

<div class="review-story" ng-repeat="review in reviews">
  {{review.story | limitTo: review.limit || 30}}<br />
  {{review}}
  <a href="#" ng-click="increaseLimit(review)">click me</a>
</div>

【讨论】：