Content does not load when I use ng-repeat and the class "item" on demo project

[gpferreira]

Hello all !!

I'm using the demo project for testing features and when I loaded the contents of friends page using ng-repeat nothing happened. No item were loaded. I noticed that class "item" on "a" element is causing this, but I don't know why.

Any idea?

Thank's and sorry for my bad english.

[n40jpj]

I have seen this before. If you put the js for calling the material transitions after you have retrieved your data for the ng-repeat it should work fine

[gpferreira]

Thank you for reply, but it not working yet. Look my controller:

.controller('FriendsCtrl', function($scope, $stateParams, $timeout, ionicMaterialInk, ionicMaterialMotion) {
    // Set Header
    $scope.$parent.showHeader();
    $scope.$parent.clearFabs();
    $scope.$parent.setHeaderFab('left');

    $scope.friends = [
        {
            name : "Jon Snow",
            description: "Da illest illegitimate"
        },
        {
            name: "Daenerys Targaryen",
            description: "Dragon mommy"
        }
    ];

    // Delay expansion
    $timeout(function() {
        $scope.isExpanded = true;
        $scope.$parent.setExpanded(true);
    }, 300);

    // Set Motion
    ionicMaterialMotion.fadeSlideInRight();

    // Set Ink
    ionicMaterialInk.displayEffect();
})

and my template:

<ion-view view-title="Friends">
    <ion-content ng-class="{expanded:isExpanded}" class="animate-fade-slide-in">
        <div>
            <div class="list animate-fade-slide-in-right">
                <a href="#/app/profile" ng-repeat="friend in friends" class="item item-avatar item-icon-right">
                    <img src="img/jon-snow.jpg">
                    <h2>{{friend.name}}</h2>
                    <p>{{friend.description}}</p>
                </a>
            </div>
        </div>
    </ion-content>
</ion-view>

Any other idea?

[rbrandino1]

I realized that in lists using the ionic directives, I can not run the ripple effects.

However, that your case, where you are using , simply call the function "ionicMaterialInk.displayEffect ();" after "ng-repeat" being fully charged.

You can find the solution here: #46

[gpferreira]

Ok. Thank you for your reply.

I'll try the proposed solutions.