AngularJs：在轮播中包含 ng-repeat 的问题

Question

我正在使用 flexslider 创建轮播，我正在使用 ng-repeat 在该轮播中显示所需的列表。

我想要的是它在一张幻灯片中显示一个项目，但它在第一张幻灯片中显示整个列表，而在第二张幻灯片中，它只显示第一个项目的次数与列表本身的大小一样多.

请帮忙，谢谢。

 <div class="page" ng-controller="mainController" >
    <section class="container-fluid">
        <div class="row-fluid bg-white">
            <div class="flexslider">
                <ul class="slides" ng-repeat="f in feed" >
                    <li class="carousel-bg1 ">
                        <div class="carousel-data">
                            <div class="carousel-text">
                                <h5><span>{{f.time}}</span></h5>
                            </div>
                            <div class="row-fluid testimonial-spec">
                                <article class="span10 carousel-text">
                                    <p>{{f.news}}</p>
                                </article>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div><!-- row-fuild : ends -->
    </section> <!-- container-fluid : ends-->
</div> <!-- competitions-carousel : ends -->

Answer 1

您正在重复滑块 ul 列表并且很可能想要重复 li 列表项。试一试：

<div class="page" ng-controller="mainController" >
    <section class="container-fluid">
        <div class="row-fluid bg-white">
            <div class="flexslider">
                <ul class="slides">
                    <li class="carousel-bg1"  ng-repeat="f in feed">
                        <div class="carousel-data" >
                            <div class="carousel-text">
                                <h5><span>{{f.time}}</span></h5>
                            </div>
                            <div class="row-fluid testimonial-spec">
                                <article class="span10 carousel-text">
                                    <p>{{f.news}}</p>
                                </article>
                            </div>
                        </div>
                    </li>
                </ul>
            </div>
        </div><!-- row-fuild : ends -->
    </section> <!-- container-fluid : ends-->
</div> <!-- competitions-carousel : ends -->

AngularJs：在轮播中包含 ng-repeat 的问题

AngularJs: issue in including ng-repeat in a carousel

javascript

jquery

twitter-bootstrap

flexslider

angularjs