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

Dúvida no Ex. 1 da Aula 1 - Construindo o alicerce da nossa aplicação

minha pagina não exibe a imagem.

fica exibindo {{foto.titulo}} ao inves de aparcer a imagem

4 respostas

Olá Giovanni,

compartilhe por favor o código do seu Controller e da página para podermos dar uma olhada.

Att.

Giovanni, só essa informação não é suficiente. Cole o código usando a formatação do alura. Além do controller como Djonathan pediu, cole o código do index.html e do main.js também. Para completar, abra o console do seu navegador quando ele exibir a página com problema. Com certeza deve haver uma mensagem de erro lá (ou mais de uma). Cole essa mensagem também.

Faça uma checagem redobrada se todos os arquivos estão salvos na pasta correta e se o import desses arquivos no index.html estão corretos.

Angular é JavaScript, por isso JavaScript é um pré-requisito fundamental, inclusive a habilidade de detectar problemas. É isso que vamos te ajudar, a encontrar onde está seu erro.

solução!
<!DOCTYPE html>
<html>
    <head ng-app="alura">
        <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>
    </body>

</html>
angular.module('alura').controller('FotosController', function($scope) {

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

});

Tive que alterar sua resposta, você não envolveu o código na formatação e ele ficou ilegível. Editei e envolvi ele na formatação (experimente clicar em editar resposta para você ver como eu envolvi seu código, é uma boa você aprender a fazer isso).

Faltou o main.js e faltou a mensagem de erro que é exibida no console do navegador.

Se o seu main.js estiver correto, você gravou os arquivos em pastas diferentes do que você está indicando na tag scriptou trocou o nome do arquivo para singular.

Aguardando o restante do seu código e a mensagem de erro que é exibida no console do navegador.

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