How to modify css of every element from ng-repeat?

[Anuj]

I am a newbie to angular and javascript development.

I am trying to build a control that will take an array of images and place them at different positions based on their size and other ordering attributes.  What comes to my mind is that I use absolute positioning for each of the image elements, and then modify the element's css to position them based on some positioning algorithm.  However, I am unable to find a way to iterate through the elements - could someone please suggest a way.

/* Services */
angular.module('dn.services', ['ngResource'])
  .value('version', '0.1')
  .factory('Cards', function($resource) {
    return $resource('cards/:cardId.json', {}, {
      query: {
               method: 'GET',
               params: { cardId: 'cards' },
               isArray: true
             }
   });
   })
  ;

// Controller
function dnCtrl($scope, $routeParams, Cards) {
  $scope.cards = Cards.query();
};

// partial
<div class="dn-gallery-panel">
  <div ng-repeat="card in cards" class="dn-card">
    <img ng-src={{card.imageUrl}}>
  </div>
</div>

I want to modify the css for every card in the ng-repeat at control load time.

Please feel free to recommend other approaches to do so.

Thanks,

Anuj

[Andy Joslin]

Here's an example where I change the style based on the index of the item: http://jsfiddle.net/4LhN9/22/

[Anuj Shah]

Thanks Andy this helps.

Anuj

On Tue, Sep 11, 2012 at 1:05 PM, Andy Joslin <andyt...@gmail.com> wrote:

Here's an example where I change the style based on the index of the item: http://jsfiddle.net/4LhN9/22/

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en.
 
 

--
Anuj

(404) 661 9776