首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
社区首页 >问答首页 >Angularjs ng-根据控制器中的变量重复重复

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

Stack Overflow用户
提问于 2015-08-23 05:58:20
回答 2查看 126关注 0票数 0

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

代码语言:javascript
代码运行次数:0
运行
复制
<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

代码语言:javascript
代码运行次数:0
运行
复制
(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过滤器的代码。

代码语言:javascript
代码运行次数:0
运行
复制
<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>
EN

回答 2

Stack Overflow用户

回答已采纳

发布于 2015-08-23 06:12:27

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

这是一个样本,

使用limitTo:

代码语言:javascript
代码运行次数:0
运行
复制
   <div ng-repeat="item in items | limitTo:needed">
           {{item.name}}
     </div>

limitTo

票数 0
EN

Stack Overflow用户

发布于 2015-08-23 06:12:53

有两种方法可以这样做。

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

代码语言:javascript
代码运行次数:0
运行
复制
<tr ng-repeat="email in emails" ng-hide="conversation.length() < $index">
    //same as in the question        
</tr>

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

HTML:

代码语言:javascript
代码运行次数:0
运行
复制
<tr ng-repeat="email in emails | conversationFilter: conversation">
    //same as in the question        
</tr>

滤波器:

代码语言:javascript
代码运行次数:0
运行
复制
app.filter('conversationFilter', function() {
    return function(collection, conversation) {
        return collection.slice(0, conversation);
    }
})
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/32163677

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档