Fotos não estão sendo carregadas | AngularJS: crie webapps poderosas

<!DOCTYPE html>
<html ng-app="alurapic">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>Alurapic</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <script type="text/javascript" src="js/lib/angular.min.js"></script>
    <script type="text/javascript" src="js/main.js"></script>
    <script type="text/javascript" src="js/controllers/fotosController.js"></script>
</head>

<body ng-controller="FotosController">

    <div class="container">
        <div class=" jumbotron">
            <h1 class="text-center">Alurapic</h1>
        </div>
        <div  ng-repeat = "foto in fotos " class="panel panel-default"> 
            <div class="panel-heading">
                <h3 class="panel-title">{{foto.titulo}}</h3>
            </div>
        </div>
        <div class=" panel-body">
            <img class="img-responsive center-block" src="{{foto.url}}" >
        </div><!-- fim panel -->
    </div> <!-- fim container -->
</body>

</html>

Este é meu controller:

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

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


});

O problema é que ele carrega o titulo mas não apresenta a imagem do servidor. O que poderia ser?

Obs: não gera nenhum erro no console.