ng-repeatでカルーセルを作成しようとしています

Question

イメージとそれに対応する名前を自分のDIVに表示するng-repeatがあります。

これを3台が画面に表示され、次の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> 

Answer 1

試してみてください。

<img ng-src="{{ a.hero }}"></img>