[v1.0.0-beta.11] Collection Repeat doesn't work with Directives

Hmm, that is really odd. So are you just trying to create a background image directive?

Yeah, so I can cache the images

Hmm, well I’d let collection repeat work with cache, it does that automatically.

By cache I mean imgcachejs (save image locally)

I’m having the same or similar issue in beta.11 - i have something like

<ion-list class="list list-inset card">
    <ion-item class="item my-item"
              collection-repeat="post in postsqueue"
        {{post.id}} {{post.status}}
        <timelinepost post="post"></timelinepost>

“timelinepost” looks something like

.directive ( 'timelinepost', ['PostConstants', function(PostConstants) {
    return {
        restrict: 'E',
        scope: {
            'masterPost': '=post'
        templateUrl: 'bobs-template.html',
        link: function(scope, element, attrs) {
            var names = [];
            _.each(scope.masterPost.posts, function(childPost) {
            scope.names = names.join(", ");

As far as i can tell - the link function is never hit. If i change back to ng-repeat all is well.

It seems this may be related as well?

Apologies in advance if i am way off here.

I do believe it’s the same issue.
The question is how to solve it… My lists are getting bigger…

1 Like

I was having the same issue and I had tried a lot of different methods to get it fix.
Finally I found myself a temporary solution.
First isolate scope with the attribute by using two-way binding ‘=’, after that I use scope.$watch to check the changes and perform the task. Following is the fork of the amended code.
Hope it helps.

See the Pen wfeEo by Wayne Cheah (@waynecheah) on CodePen.


Adding the $scope.$watch() indeed works. Thanks for the suggestion. Will we have to do it this way or can we expect a fix in later editions?

1 Like

What are the implications of using $scope.$watch() with a big list (the purpose of collection-repeat)?

Will this be the final solution? Thank you.

1 Like

I used it and worked. I expect soon to have a better solution but indeed this one works.

Should we open an issue for this on GitHub? I do think this is a major bug. Directives are what angular is about.


i was seeing a similar issue, oddly enough it was working some portion of the time to resolve a directive. i tried the watch trick and had some luck. a interesting idea for sure. I’m not sure what the protocol is for issue starting, but i’d be in favor. i’m curious if it will be addressed in the next release? it feels a bit hacky to watch these items, (if it was done behind the scenes, i’d feel better)

I’m having similar issue Problem with using my own directive inside collection-repeat

@mhartington, did this problem ever got resolved? I am now on v.1.0.0-final and this problem is still here, directives fail when placed inside collection-repeat. Everything runs ok with ng-repeat though.

From what I remember, this is a known issue and would require a refactor of collection repeat.
It is something we know about and plan on fixing.

@mhartington, what now u have done with it? any changes for fixing it?

$scope.watch is unfriendly for me and making a lags on scroll.

We have not gotten to the issue yet. There are many other issues that are taking priority. Pull-requests are always welcomed though.

Any update on this? I’m re-factoring the code in my current project and ran into this issue :frowning:


I don’t know if the problem is solved or not, but i could fix it with ng-if on the current item. So the directive is intancied only when data are good with the collection-repeat

<ion-item collection-repeat="request in requests">
          <request ng-if="request" request="request"/>

Give me feedback.


This is not working, that duplicates entries and hide others …

I didn’t found other solution than duplicate code