Entrar Ainda não tem acesso?
Solucionado (ver solução)
Solucionado
(ver solução)
9
respostas

Problema Com Angular

Referente ao curso AngularJS: crie webapps poderosas, no capítulo Construindo o alicerce da nossa aplicação e atividade Colocando em prática

por Luciano Henrique
| 413.9k xp | 20 posts
Desenvolvedor C#

Abaixo segue o código exatamente iguais ao do exercício e o Erro que aparece no console

index.html : 

<!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>
</html>

main.js

angular.module('alurapic',[]);

fotos-controller.js 

angular.module('alurapic').controller('FotosController',function($scope){
    $scope.foto={
        titulo: 'Leão',
        url:'http://www.fundosanimais.com/Minis/leoes.jpg'
    };
});

Erro :

Uncaught SyntaxError: Unexpected token < angular.min.js:21 Uncaught Error: [$injector:nomod] http://errors.angularjs.org/1.3.15/$injector/nomod?p0=alurapic at angular.min.js:6 at angular.min.js:21 at a (angular.min.js:21) at Object.module (angular.min.js:21) at fotos-controller.js:1 angular.min.js:35 Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.3.15/$injector/modulerr?p0=alurapic&p1=Error%…uc%20(http%3A%2F%2Flocalhost%3A3000%2Fjs%2Flib%2Fangular.min.js%3A18%3A179) at angular.min.js:6 at angular.min.js:35 at r (angular.min.js:7) at g (angular.min.js:34) at ab (angular.min.js:38) at d (angular.min.js:17) at uc (angular.min.js:18) at Jd (angular.min.js:17) at angular.min.js:250 at HTMLDocument.a (angular.min.js:164)

9 respostas
por Estudante
| 719.4k xp | 745 posts

E aí, Luciano! Tudo certo, cara? =)

Qual erro está aparecendo para você? Acho que você se esqueceu de colocá-lo... Rs.

Fábio

por Luciano Henrique
| 413.9k xp | 20 posts
Desenvolvedor C#

Pronto , atualizei e coloquei o erro que aparece

por Estudante
| 719.4k xp | 745 posts

Luciano,

Esse erro é referente ao módulo alurapic... No momento em que você foi definir o seu FotosController, você teve que fazer algo como abaixo:

angular.module('alurapic').controller('FotosController', ...);

Nessa linha, você está criando um novo Controller associado ao módulo alurapic... Entretanto, nesse momento, o Angular reclama que não encontrou esse módulo. =|

Você chegou a verificar se havia mais algum erro no console? É possível que o nome de algum arquivo esteja com nome errado, ou no diretório incorreto... =|

Fábio

por Luciano Henrique
| 413.9k xp | 20 posts
Desenvolvedor C#

Não existe mais nenhum erro no console, somente esse que eu coloquei , ja procurei soluções em outros topicos mas nao acho nada parecido

por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Pode ficar tranquilo que mais de 1000 alunos passaram dessa parte fazendo exatamente como eu faço.

Verifique se os caminhos de importação em index.html estão corretos e se salvou os arquivos no local correto.

Vamos descobrir.

solução!
por Luciano Henrique
| 413.9k xp | 20 posts
Desenvolvedor C#

Consegui resolver, o problema estava em eu não havia colocado o '/services/' e por isso não conseguia encontrar o módulo

por Manfrine Silva
| 28.7k xp | 7 posts

Flávio, o meu tbm deu erro, desde a importação do primeiro script em referencia ao angular no caso

    <script src="js/lib/angular.mim.js"> </script>

construi tudo 

<!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.mim.js"> </script>
        <script src="js/main.js"> </script>
        <script src="js/controllers/fotos-controller.js"> </script>
    </head>
    <body>
        <div class="container">
            <h1 class="text-center">Alurapic</h1>
            <img class="img-resposive center-block" src="{{foto.url}}" alt="{{foto.titulo}}">
        </div> <!-- fim container -->
    </body>
</html>

ele não reconhece o angular, mesmo criando uma app html simples, a aplicacao nao reconhece

 <head>
     <title>Hello World !!</title>
     <script src="angular.js"></script>
</head>

o erro do console foram

angular.mim.js Failed to load resource: net::ERR_FILE_NOT_FOUND
%7B%7Bfoto.url%7D%7D Failed to load resource: net::ERR_FILE_NOT_FOUND
main.js:1 Uncaught ReferenceError: angular is not defined
    at main.js:1
por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Manfrine, foi por sorte que vi seu comentário nesse post já solucionado. Quando tiver uma dúvida, evite postar em um post já solucionado porque ele não parece para outros moderadores.

por Flavio Henrique de Souza Almeida
| 3119.3k xp | 6969 posts
Instrutor Instrutor/Desenvolvedor Web Sênior/Autor

Aliás, você escreveu errado o nome do arquivo, é um erro de digitação:

 <script src="js/lib/angular.mim.js"> </script>

Inclusive a mensagem de erro esta deixando claro que não foi possível achar o arquivo. Só que seu erro é difererente do erro do aluno que postou nessa tread, nele, o caminho estava errado, no seu caso, o nome do arquivo esta errado.

O correto é angular.min.js, você usou angular.mim.js.