Solucionado (ver solução)
Solucionado
(ver solução)
5
respostas

Erro: angular.min.js:102:325 E fotos-controller.js:1

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

E

"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!

5 respostas

Compartilhe o código de fotos-controller. Pode fica tranquila que mais de 1000 alunos passaram dessa parte sem problema algum. Vamos descobrir.

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

    $scope.foto = {
        titulo : 'Leão',
        url : 'http://www.fundosanimais.com/Minis/leoes.jpg'
    };

});

OBS: Quando clico no console no "fotos-controller.js:1 no console, o navegador apresenta o código do index. Daí o erro, o arquivo .js não reconheceria tag html. Mas porque o código da index é apresentado?

solução!

A mensagem de erro que foi postada é a seguinte:

Error: [ng:areq] http://errors.angularjs.org/1.3.15/ng/areq?p0=FotosController&p1=not%20a%20function%2C%20got%20undefined

Eu consigo repetir a mesma mensagem de erro se eu escrever errado o nome do controller.

Talvez o problema esteja no caminho do arquivo onde está o controller

 <script src="js/controllers/fotos-controller.js"></script>

Daniel apontou bem. Isabela, você salvou o arquivo com o nome e pasta corretos?

Consegui, resolver com o que o Daniel falou!

alterei o caminho do arquivo para:

 <script src="../js/controllers/foto-controllers.js"></script>

Muito Obrigada!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software