Question

我有一个正在填充的表：

<table>
          <tr>
            <th>Id</th>
            <th>Details</th>
            <th>Score</th>
          </tr>
          <tr ng-repeat="x in data.items">
            <td><a href="{{ x.get }}">{{ x.id }}</td>
            <td>
                <p><b>{{ x.name[0] }}</b></p>
                <p><u>Brand</u>: {{ x.Brand }}; <u>Category URL</u>: {{ x.mlnURL }};<u>Price</u>: Rs {{x.Price}} </p>
            </td>
            <td>
                <p><a href="{{x.explain}}"><b>{{ x.score }}</b></a></p>
                Classifier Score: {{ x.cscore }} <br>
                Document Score: {{ x.sscore }} </p>
            </td>
          </tr>
        </table>

现在就在这一行

<tr ng-repeat="x in data.items">

而不是在data.items中运行敌人所有x，我想根据用户的需要运行它有限次数。我有来自用户的这个数字输入并存储在变量中。我怎样才能做到这一点。

Answer 1

你走了：
<tr ng-repeat="x in data.items | limitTo: 2">

使用此代码重复2次。您可以将范围更改为2。

Answer 2

您可以使用过滤器limitTo，如下例所示：

＆＃13;

angular.module('myApp', [])
  .controller('myCont', function($scope) {
    var theItems = [{
      name: 'walkman',
      Brand: 'sony',
      Price: 20,
      explain: 'an AM/FM cassette player',
      score: 89,
      mlnURL: 'http://sony.com'
    }, {
      name: 'discman',
      Brand: 'sony',
      Price: 30,
      explain: 'a CD player',
      score: 83,
      mlnURL: 'http://sony.com'
    }, {
      name: ['ipod'],
      Brand: 'Apple',
      Price: 200,
      explain: 'an MP3 player',
      score: 89,
      mlnURL: 'http://apple.com'
    },
    {
      name: ['Flash Player'],
      Brand: 'SanDisk',
      Price: 40,
      explain: 'an MP3 player',
      score: 79,
      mlnURL: 'http://sandisk.com'
    }];
    $scope.data = {items: theItems};
  $scope.limit = 2;
  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCont">
  # of items to show <input type="number" ng-model="limit"/>
  <table>
    <tr>
      <th>Id</th>
      <th>Details</th>
      <th>Score</th>
    </tr>
    <tr ng-repeat="x in data.items | limitTo: limit">
      <td><a href="{{ x.get }}">{{ x.id }}</td>
            <td>
                <p><b>{{ x.name[0] }}</b></p>
                <p><u>Brand</u>: {{ x.Brand }}; <u>Category URL</u>: {{ x.mlnURL }};<u>Price</u>: Rs {{x.Price}} </p>
            </td>
            <td>
                <p><a href="{{x.explain}}"><b>{{ x.score }}</b></a>
        </p>
        Classifier Score: {{ x.cscore }}
        <br>Document Score: {{ x.sscore }}
      </td>
    </tr>
  </table>
</div>

＆＃13;

Answer 3

您可以使用现有过滤器轻松完成。

<input type="text" ng-model="numberOfRecord" />

然后你可以在ng-repeat中使用它。

<tr ng-repeat="x in data.items | limitTo: numberOfRecord">

人们通常使用组合框来获取每页的记录数，如果需要，您还可以使用分页。

希望您的查询得到解决：）

Answer 4

如果你有用户输入，你可以做的是创建一个包含你想要的所有数量值的新数组。

在您的控制器中，您可以这样做：

var toShow = data.items.slice(0, size);

只需在模板中使用toShow数组即可。每次更新大小时，都会重新计算toShow数组。

Answer 5

试试这个：

<tr ng-repeat="x in data.items | limitTo: 2">

Answer 6

您可以在angularJs中使用limitTo过滤器语法为{{item | limitTo : limit : begin}}

<td ng-repeat="x in data.items | limitTo : userinput">

您还可以使用上面提到的'begin'来指定列表的开始位置

如何在angular JS中运行ng-repeat语句的次数有限

6 个答案: