问Angularjs ng-根据控制器中的变量重复重复
EN

Stack Overflow用户

提问于 2015-08-22 21:58:20

回答 2查看 126关注 0票数 0

这是部分观点。Ng-repeat在包含50条电子邮件记录的json文件上重复。

<table class="table table-hover" ng-controller="emailViewController">
    <tbody data-ng-controller="settingsController">
    <tr ng-repeat="email in emails" >
        <td><input type="checkbox" ng-checked="checkAllEmail" ng-model="selectedEmail"/>
            <a href="#">
                <span class="glyphicon glyphicon-star-empty"></span>
            </a></td>
        <td><label ng-bind="email.from"></label></td>
        <td><label ng-bind="email.subject"></label></td>
        <td><label ng-bind="email.time"></label></td>
    </tr>
    </tbody>
</table>

settingsController.js

(function() {
    'use strict';

    var settingController = function (fetchDataService, $scope, savePreferenceService, $localStorage) {
        $scope.url = 'app/mock/settings.json';
        $scope.save = {};

        fetchDataService.getContent($scope.url)
            .then(function(response){
                $scope.contacts = response.data.contacts;
                $scope.languages = response.data.languages;
                $scope.conversations = response.data.conversations;
                $scope.undoSend = response.data.undoSend;
                $scope.save = response.data.userPreferences;
            });

         $scope.setPreference = function () {
            savePreferenceService.setPreferences($scope.save.selectedLang, $scope.save.converse, $scope.save.selectedNumber, $scope.save.selectedNumberContact, $scope.save.reply, $scope.save.signature);
        }

        $scope.conversation = $localStorage.selectedNumber;
    };

    angular.module('iisEmail')
        .controller ('settingsController',
        ['fetchDataService', '$scope', 'savePreferenceService', '$localStorage', settingController]);
}());

我很难弄清楚如何让ng-repeat迭代JSON文件，这取决于$scope.conversation的值。因此，例如，如果$scope.conversation是10，我希望ng-repeat只迭代10次。我不想显示剩下的40封邮件。有没有人对如何实现这一功能有任何想法？

更新

在@Prashank的评论的帮助下，我明白了这一点。下面是使用limitTo过滤器的代码。

<table class="table table-hover" ng-controller="emailViewController">
    <tbody data-ng-controller="settingsController">
    <tr ng-repeat="email in emails | limitTo: conversation" >
        <td><input type="checkbox" ng-checked="checkAllEmail" ng-model="selectedEmail"/>
            <a href="#">
                <span class="glyphicon glyphicon-star-empty"></span>
            </a></td>
        <td><label ng-bind="email.from"></label></td>
        <td><label ng-bind="email.subject"></label></td>
        <td><label ng-bind="email.time"></label></td>
    </tr>
    </tbody>
</table>

javascript

angularjs

angularjs-directive

1元体验云点播

覆盖建站/短视频等热门场景，提供媒资管理、短视频 SDK、小程序插件和播放器云+端一体化能力，助您抓住视频风口

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-08-22 22:12:27

您可以使用limitTo或片并执行以下操作，

这是一个样本，

使用limitTo:

   <div ng-repeat="item in items | limitTo:needed">
           {{item.name}}
     </div>

limitTo

票数 0

Stack Overflow用户

发布于 2015-08-22 22:12:53

有两种方法可以这样做。

轻松的方法是在ng中使用$index -重复隐藏/显示项目如下：

<tr ng-repeat="email in emails" ng-hide="conversation.length() < $index">
    //same as in the question        
</tr>

我这样做的方式(虽然有点冗长)是使用过滤器，如下所示：

HTML:

<tr ng-repeat="email in emails | conversationFilter: conversation">
    //same as in the question        
</tr>

滤波器：

app.filter('conversationFilter', function() {
    return function(collection, conversation) {
        return collection.slice(0, conversation);
    }
})