Olá Professor, Minha imagem não está carregando conforme a aula, mudei só o nome da foto e a url.
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Solucionado
Olá Professor, Minha imagem não está carregando conforme a aula, mudei só o nome da foto e a url.
<!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/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>
angular.module('alurapic').controller('FotosController',function($scope){
$scope.foto ={
titulo:'Gatos',
url: 'http://www.fundosanimais.com/imagens-siameses-jpg'
};
});
js/main.js
angular.module('alurapic', []);Os erros no network do modo desenvolvedor são:
Uncaught SyntaxError: Unexpected token < main.js:1
Uncaught ReferenceError: angular is not defined at main.js:1 (anonymous) @ main.js:1 fotos-controller.js:1
Uncaught ReferenceError: angular is not defined at fotos-controller.js:1 (anonymous) @ fotos-controller.js:1
Os erros ocasionados aconteceram porque a aplicação não está encontrando os arquivos importados no head do HTML. O arquivo do AngularJS se encontra dentro da pasta lib, que está na pasta JS, então ficaria assim:
<script src="js/lib/angular.min.js"></script>