javascript - Dynamic background color in Bootstrap Carousel with AngularJS -


i have strange behaviorin bootstrap carousel using angularjs. below html code trying dynamically add background color each thumbnail. observe following:

  1. initially, "active" part of carousel adds background color dynamically each thumbnail expected.
  2. however, once start rotating carousel, thumbnails lose background color.
  3. now, when reload page, thumbnails background color again.

so cannot understand causing loss of background color during rotation? thanks.

    <div class="well">         <div id="mycarousel" class="carousel slide">              <!-- carousel items -->             <div class="carousel-inner">                   <div ng-repeat="imgset in imgsets" ng-class="{item: true, active : $first}">                      <div ng-class="row">                         <div ng-repeat="img in imgset track img.id" class="col-sm-3">                              <a href="/appdetail/{{img.id}}" class="thumbnail" style="background-color: {{img.tile_color}};">                                    <img ng-src="{{uri}}/{{img.image}}" alt="image" class="img-responsive" height="{{img.tile_height}}" width="{{img.tile_width}}">                             </a>                         </div>                     </div>                         <!--/row-->                 </div>                 <!--/item-->              </div>             <!--/carousel-inner-->               <a class="left carousel-control" href="#mycarousel" data-slide="prev">‹</a>             <a class="right carousel-control" href="#mycarousel" data-slide="next">›</a>         </div>         <!--/mycarousel-->     </div>     <!--/well--> 

well found how fix it, still not understand why original not working (and why fix working):

my {{img.tile_color}} string of form "#1956b7" (or other #). thought 1 must have "#" sign in front of number. when removed "#" started working.


Comments

Popular posts from this blog

c - Bitwise operation with (signed) enum value -

xslt - Unnest parent nodes by child node -

YouTubePlayerFragment cannot be cast to android.support.v4.app.Fragment -