ng-repeat 不显示列表之一答案

【问题标题】：ng-repeat not showing the one of the listingsng-repeat 不显示列表之一
【发布时间】：2015-10-20 08:10:35
【问题描述】：

网络捕获数据库中的所有 4 个列表。但是，它没有捕获右侧的列表之一。我不明白为什么只有其中一个被忽略了。

这是html代码：

    <div class="row" ng-repeat="company in companies" ng-show="companies.indexOf(company) > 0 && companies.indexOf(company) % 2 == 1">
            <!-- Company 1 Starts Here -->
            <div class="col-md-6 col-sm-6 col-xs-12 companies-leftPadding">
                <div class="leftbar topgap">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                            <div class="pull-right" style="position: absolute;top: 20px;right: 20px;">
                                <span class="cursor companies-follow-button">Follow</span>
                            </div>
                                <img ng-src="{{company.cover_picture_324_150}}" class="companies-card-frontpage img-responsive companies-frontpage" alt="{{company.company_name}}">
                            <div class="companies-description text-center halfPadding">
                                &nbsp;
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="text-center" style="margin-top: -50px;">
                                <a class="cursor" ui-sref="app.companydetails({company_slug : company.slug})">
                                    <img class="companies-card-logo" ng-src="{{company.company_logo_168_168}}">
                                    <h4 class="font-weight-600 companies-card-name">{{company.company_name}}</h4>
                                </a>
                                    <div class="font-weight-300 companies-card-type">
                                        {{company.category[0].category}} | {{company.locations[0].cities}}
                                    </div>
                            </div>
                        </div>
                    </div>
                    <div class="fullPadding">
                        <div class="row companies-card-header-main" >
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-left">
                                <small>Happiness Index</small>
                            </div>
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-right">
                                <small>Followers: {{company.followers_count}}</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Company 2 Starts Here -->
            <div class="col-md-6 col-sm-6 col-xs-12 companies-rightPadding">
                <div class="leftbar topgap">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                            <div class="pull-right" style="position: absolute;top: 20px;right: 20px;">
                                <span class="cursor companies-follow-button">Follow</span>
                            </div>
                            <img ng-src="{{companies[companies.indexOf(company)+1].cover_picture_324_150}}" class="companies-card-frontpage img-responsive companies-frontpage" alt="">
                            <div class="companies-description text-center halfPadding">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="text-center" style="margin-top: -50px;">
                                <a ui-sref="app.companydetails({company_slug : companies[company.indexOf(company)+1].slug})">
                                    <img class="companies-card-logo" ng-src="{{companies[companies.indexOf(company)+1].company_logo_168_168}}">
                                    <h4 class="font-weight-600 companies-card-name">{{companies[companies.indexOf(company)+1].company_name | characters:25 }}</h4>

                                    <div class="font-weight-300 companies-card-type">{{companies[companies.indexOf(company)+1].category[0].category}} | {{companies[companies.indexOf(company)+1].locations[0].cities}}</div>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="fullPadding">
                        <div class="row companies-card-header-main" >
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-left">
                                <small>Happiness Index:</small>
                            </div>
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-right">
                                <small>Followers: {{companies[companies.indexOf(company)+1].followers_count}}</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

这是 4 个列表的输出。请参阅最后一个清单没有绑定数据。我不知道为什么：

    <div class="row ng-scope ng-hide" ng-repeat="company in companies" ng-show="companies.indexOf(company) > 0 &amp;&amp; companies.indexOf(company) % 2 == 1">
            <!-- Company 1 Starts Here -->
            <div class="col-md-6 col-sm-6 col-xs-12 companies-leftPadding">
                <div class="leftbar topgap">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                            <div class="pull-right" style="position: absolute;top: 20px;right: 20px;">
                                <span class="cursor companies-follow-button">Follow</span>
                            </div>
                                <img ng-src="http://53.71.21.XX/apis/media/company_cover_picture/cover_picture_324_150/internship-FULL-VIEW_AU5JaHB.jpg" class="companies-card-frontpage img-responsive companies-frontpage" alt="flip_company_7" src="http://53.71.21.XX/apis/media/company_cover_picture/cover_picture_324_150/internship-FULL-VIEW_AU5JaHB.jpg">
                            <div class="companies-description text-center halfPadding">
                                &nbsp;
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="text-center" style="margin-top: -50px;">
                                <a class="cursor" ui-sref="app.companydetails({company_slug : company.slug})" href="/company/flip_company_7">
                                    <img class="companies-card-logo" ng-src="http://53.71.21.XX/apis/media/company_logo/company_logo_168_168/User-Reputation_l1I1tXQ.jpg" src="http://53.71.21.XX/apis/media/company_logo/company_logo_168_168/User-Reputation_l1I1tXQ.jpg">
                                    <h4 class="font-weight-600 companies-card-name ng-binding">flip_company_7</h4>
                                </a>
                                    <div class="font-weight-300 companies-card-type ng-binding">
                                        Advertising and Agencies | Toronto
                                    </div>
                            </div>
                        </div>
                    </div>
                    <div class="fullPadding">
                        <div class="row companies-card-header-main">
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-left">
                                <small>Happiness Index</small>
                            </div>
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-right">
                                <small class="ng-binding">Followers: 0</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Company 2 Starts Here -->
            <div class="col-md-6 col-sm-6 col-xs-12 companies-rightPadding">
                <div class="leftbar topgap">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                            <div class="pull-right" style="position: absolute;top: 20px;right: 20px;">
                                <span class="cursor companies-follow-button">Follow</span>
                            </div>
                            <img ng-src="http://53.71.21.XX/apis/media/company_cover_picture/cover_picture_324_150/internship-FULL-VIEW_NXJtjVx.jpg" class="companies-card-frontpage img-responsive companies-frontpage" alt="" src="http://53.71.21.XX/apis/media/company_cover_picture/cover_picture_324_150/internship-FULL-VIEW_NXJtjVx.jpg">
                            <div class="companies-description text-center halfPadding">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="text-center" style="margin-top: -50px;">
                                <a ui-sref="app.companydetails({company_slug : companies[company.indexOf(company)+1].slug})" href="/company/flip_company_14">
                                    <img class="companies-card-logo" ng-src="http://53.71.21.XX/apis/media/company_logo/company_logo_168_168/User-Reputation_ja4z99I.jpg" src="http://53.71.21.XX/apis/media/company_logo/company_logo_168_168/User-Reputation_ja4z99I.jpg">
                                    <h4 class="font-weight-600 companies-card-name ng-binding">flip_company_6</h4>

                                    <div class="font-weight-300 companies-card-type ng-binding">Advertising and Agencies | Toronto</div>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="fullPadding">
                        <div class="row companies-card-header-main">
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-left">
                                <small>Happiness Index:</small>
                            </div>
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-right">
                                <small class="ng-binding">Followers: 0</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="row ng-scope" ng-repeat="company in companies" ng-show="companies.indexOf(company) > 0 &amp;&amp; companies.indexOf(company) % 2 == 1">
            <!-- Company 1 Starts Here -->
            <div class="col-md-6 col-sm-6 col-xs-12 companies-leftPadding">
                <div class="leftbar topgap">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                            <div class="pull-right" style="position: absolute;top: 20px;right: 20px;">
                                <span class="cursor companies-follow-button">Follow</span>
                            </div>
                                <img ng-src="http://53.71.21.XX/apis/media/company_cover_picture/cover_picture_324_150/internship-FULL-VIEW_NXJtjVx.jpg" class="companies-card-frontpage img-responsive companies-frontpage" alt="flip_company_6" src="http://53.71.21.XX/apis/media/company_cover_picture/cover_picture_324_150/internship-FULL-VIEW_NXJtjVx.jpg">
                            <div class="companies-description text-center halfPadding">
                                &nbsp;
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="text-center" style="margin-top: -50px;">
                                <a class="cursor" ui-sref="app.companydetails({company_slug : company.slug})" href="/company/flip_company_6">
                                    <img class="companies-card-logo" ng-src="http://53.71.21.XX/apis/media/company_logo/company_logo_168_168/User-Reputation_ja4z99I.jpg" src="http://53.71.21.XX/apis/media/company_logo/company_logo_168_168/User-Reputation_ja4z99I.jpg">
                                    <h4 class="font-weight-600 companies-card-name ng-binding">flip_company_6</h4>
                                </a>
                                    <div class="font-weight-300 companies-card-type ng-binding">
                                        Advertising and Agencies | Toronto
                                    </div>
                            </div>
                        </div>
                    </div>
                    <div class="fullPadding">
                        <div class="row companies-card-header-main">
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-left">
                                <small>Happiness Index</small>
                            </div>
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-right">
                                <small class="ng-binding">Followers: 0</small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- Company 2 Starts Here -->
            <div class="col-md-6 col-sm-6 col-xs-12 companies-rightPadding">
                <div class="leftbar topgap">
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12 ">
                            <div class="pull-right" style="position: absolute;top: 20px;right: 20px;">
                                <span class="cursor companies-follow-button">Follow</span>
                            </div>
                            <img class="companies-card-frontpage img-responsive companies-frontpage" alt="">
                            <div class="companies-description text-center halfPadding">
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 col-sm-12 col-xs-12">
                            <div class="text-center" style="margin-top: -50px;">
                                <a ui-sref="app.companydetails({company_slug : companies[company.indexOf(company)+1].slug})" href="/company/flip_company_14">
                                    <img class="companies-card-logo">
                                    <h4 class="font-weight-600 companies-card-name ng-binding"></h4>

                                    <div class="font-weight-300 companies-card-type ng-binding"> | </div>
                                </a>
                            </div>
                        </div>
                    </div>
                    <div class="fullPadding">
                        <div class="row companies-card-header-main">
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-left">
                                <small>Happiness Index:</small>
                            </div>
                            <div class="col-md-6 col-sm-6 col-xs-6 companies-header-right">
                                <small class="ng-binding">Followers: </small>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

【问题讨论】：

标签： angularjs angularjs-ng-repeat angularjs-bindings

【解决方案1】：

检查 之后的 {{companies.indexOf(company)+1}} 是否符合您的预期。

编辑

换行

 <!-- Company 2 Starts Here -->

到 {{companies.indexOf(company)+1}}

然后检查结果 html 是什么。

【讨论】：

对不起。我无法理解你。我是这一切的新手。我的 angularJS 家伙休息了 10 天。你能再具体一点吗？谢谢。
我得到了偶数 2 和 4，但我们要去哪里？
如果你有 4 个项目，那么你的最后一个数字是 3。它是从 0 开始的
我最终通过在新 div 上应用 ng-repeat 解决了这个问题。现在看起来是这样的：

这里的内容

我希望这不会是一个问题，因为 col-xs-6 重复了。