Dúvida no Ex. 6 da Aula 4 - Melhorando a experiência do usuário

Finalizei os exercícios da aula 4 e a animação está funcionando perfeitamente. Exceto por um detalhe: ao aplicar a animação as imagens desapareceram! No console exibe que estão pendentes de carregamento. Já fiz e refiz o código, e tentei encontrar a causa, mas agora mesmo retirando a animação, as imagens não exibem mais. Seguem os códigos:

Index.html

```<!DOCTYPE html>

Alurapic

```

css/efeitos.css

```.painel-animado.ng-leave-active { -moz-transform: scale(0.1); -webkit-transform: scale(0.1); -ms-transform: scale(0.1); -o-transform: scale(0.1); transform: scale(0.1); }

.painel-animado { -moz-transition:transform 0.8s; -webkit-transition:transform 0.8s; -ms-transition:transform 0.8s; -o-transition:transform 0.8s; transition:transform 0.8s; }


js/controllers/foto-controller.js

angular.module('alurapic').controller('FotosController', function($scope, $http) {

$scope.fotos = []; $scope.filtro = '';

$http.get('/v1/fotos') .success(function(retorno) { $scope.fotos = retorno; }) .error(function(erro) { console.log(erro) });

});


js/main.js

angular.module('alurapic', ['minhasDiretivas', 'ngAnimate']); ```

O que pode ter acontecido?

<div class="panel panel-default col-md-2">  <div class="panel-heading"> <h3 class="panel-title text-center">{{titulo}}</h3> </div> <div class="panel-body" ng-transclude> </div> </div>