Brendan Brendan - 1 year ago 91
AngularJS Question

Individual classes for ng-repeat

I'm trying to figure out a clean way to add individual classes to my ng-repeat

<div class="panel-body">
<ul class="instagram-list" id="feed" ng-repeat="item in items track by $index">
<li class="box">
<a ng-href="{{}}" target="_blank">
<img ng-src="{{item.images.standard_resolution.url}}" width="294">

Where my data is coming from :

app.factory('Instagram', ['$http',
function($http) {
var base = "";
var min_tag_id = null;
// get your own client id
var clientId = 'xxxxxxxxxxx';
return {
updateMinTagId: updateMinTagId,
get: function(hashtag) {
var request = '/tags/' + hashtag + '/media/recent?count=8&access_token=xxxxxxx.xxxxxx.xxxxxxx' + (min_tag_id !== null ? '&min_tag_id=' + min_tag_id : '');
console.log('request', request, 'min_tag', min_tag_id);
var url = (min_tag_id == null ? base + request : min_tag_id);
var config = {
'params': {
'callback': 'JSON_CALLBACK'
return $http.jsonp(url, config);
function updateMinTagId(ID) {
if (angular.isUndefined(ID)) return;
min_tag_id = ID;

I've tried to make a sass loop that iterates over each item and basically just adds a number on to the end of each class something like : box-{{}} .However I'm hitting a wall and have no idea what else I could do.

Answer Source

Updated code by adding the following code to my box element.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download