尝试使用ng-repeat创建旋转木马

时间:2016-06-24 03:35:20

标签: angularjs angularjs-ng-repeat carousel

我有一个ng-repeat,它在自己的DIV中显示图像及其相应的名称。

我想把它变成一个旋转木马,其中3个在屏幕上显示,并且有一个滑块可以移动到下一个3.我已经成功地显示了名称,虽然一次只有一个反对我想要的三个,但图像是没有显示。任何人都可以指引我到我能看到的地方吗?

<section class="container">
    <div class="row">
        <div class="col-sm-12">   
          <h4>Tailor the Message for Your Audience:</h4>
          <hr />
        </div>
    </div>
    <div class="carousel" id="slider" style="margin-left: 20px;">
        <div class="carousel-inner">
            <div ng-class="{active:!$index}" ng-repeat="a in initiatives.audiences | orderBy:'position'" class="item" ng-if="a.name !== $parent.$state.params.audience_name && a.name !== 'core-message'">
                <a href="{{ a.name }}" force-refresh>
                    <!-- <div class="rectangle"> -->
                    <img ng-style="{'background-image': 'url(' + a.hero + ')'}"></img>
                    <!-- </div> -->
                    <p>{{ a.name.replace('-', ' ') }}</p>         
                </a>
            </div>
        </div>
        <a class="carousel-control right" href="#slider" data-slide="next"></a>
    </div>  
</section>

1 个答案:

答案 0 :(得分:-2)

尝试:

<item name="android:textColorSecondary">@color/WHITE</item>