Erro: angular.min.js:102:325 E fotos-controller.js:1 | AngularJS: crie webapps poderosas

Não consegui completar a última etapa da aula, ao fazer as modificações da última etapa e dar o refresh na página os seguintes erros são apresentados no console:

SyntaxError: expected expression, got '<'[Learn More]  fotos-controller.js:1

"Error: [ng:areq] http://errors.angularjs.org/1.3.15/ng/areq?p0=FotosController&p1=not%20a%20function%2C%20got%20undefined
R/<@http://localhost:3000/js/lib/angular.min.js:6:417
Rb@http://localhost:3000/js/lib/angular.min.js:19:510
sb@http://localhost:3000/js/lib/angular.min.js:20:78
Fe/this.$get</<@http://localhost:3000/js/lib/angular.min.js:75:396
B/<@http://localhost:3000/js/lib/angular.min.js:57:100
r@http://localhost:3000/js/lib/angular.min.js:7:406
B@http://localhost:3000/js/lib/angular.min.js:56:471
g@http://localhost:3000/js/lib/angular.min.js:51:335
g@http://localhost:3000/js/lib/angular.min.js:51:352
D/<@http://localhost:3000/js/lib/angular.min.js:50:444
uc/d/</<@http://localhost:3000/js/lib/angular.min.js:18:4
Pe/this.$get</n.prototype.$eval@http://localhost:3000/js/lib/angular.min.js:126:11
Pe/this.$get</n.prototype.$apply@http://localhost:3000/js/lib/angular.min.js:126:236
uc/d/<@http://localhost:3000/js/lib/angular.min.js:17:477
e@http://localhost:3000/js/lib/angular.min.js:36:313
uc/d@http://localhost:3000/js/lib/angular.min.js:17:398
uc@http://localhost:3000/js/lib/angular.min.js:18:179
Jd@http://localhost:3000/js/lib/angular.min.js:17:1
@http://localhost:3000/js/lib/angular.min.js:250:429
a@http://localhost:3000/js/lib/angular.min.js:164:283
lf/c@http://localhost:3000/js/lib/angular.min.js:32:384
"  angular.min.js:102:325

já tentei de todas as formas, o código esta exatamente igual ao do curso. Neste momento o código funciona:

<!DOCTYPE html>
<html lang="pt-br" 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 src="js/lib/angular.min.js"></script>
        <script src="js/main.js"></script>
    </head>
    <body>
        <div class="container">
            <h1 class="text-center">Alurapic</h1>
            <img class="img-responsive center-block" src="{{foto.url}}" alt="{{foto.titulo}}">
        </div><!-- fim container -->
    </body>
</html>

Os erros são apresentados com as seguintes alterações:

<!DOCTYPE html>
<html lang="pt-br" 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 src="js/lib/angular.min.js"></script>
        <script src="js/main.js"></script>
        <script src="js/controllers/fotos-controller.js"></script>
    </head>
    <body ng-controller="FotosController">
        <div class="container">
            <h1 class="text-center">Alurapic</h1>

             <img class="img-responsive center-block" src="{{foto.url}}" alt="{{foto.titulo}}">

        </div><!-- fim container -->
    </body>

obs: abaixo de alurapic, {{foto.titulo}} aparece.

Não entendo o porquê do erro, já que esta de acordo com o exercício e como eu resolvo este problema?

Obrigada!

Mergulhe em programação