Solucionado
Existe mais algum item que foi adicionado via exercícios, que não foi mostrado nos vídeos? Estou perguntando isso pois já fiz o curso de JavaScript avançado e aconteceu exatamente isso. Eu fiz os exercícios e acrescentei os mesmos no projeto do curso de JavaScript avançado e depois o que foi acrescendo via exercício foi acrescendo nos vídeos finais do curso.
Sim, há! A criação a diretiva minha-foto. Eu faço isso para saber se o aluno esta fazendo os exercícios ou se pula todos. Fora isso, tudo é igual. No final do curso tem um exercício bônus, mas é no final.
Alem da diretiva minha-foto?
segui o video e nao esta funcinando, nao esta limpando a tela quando clica no botao salvar, logo por causa disso nao esta limpando a tela e tambem nao esta aparecendo a mensagem de salvo ou nao .
no console do navegador esta aparecendo o seguinte erro : TypeError: $http.post(...).sucess is not a function at b.$scope.submeter (foto-controller.js:9) at angular.min.js:199 at f (angular.min.js:216) at b.$eval (angular.min.js:126) at b.$apply (angular.min.js:126) at HTMLFormElement. (angular.min.js:216) at HTMLFormElement.c (angular.min.js:32)
esta aparecendo esse erro, mas esta salvando. vou colocar os arquivos do projeto:
foto.html:
<div class="page-header text-center">
<h1>{{foto.titulo}}</h1>
</div>
<p ng-show="mensagem.length" class="alert alert-info">{{mensagem}}</p>
<form novalidate name="formulario" class="row" ng-submit="submeter()">
<div class="col-md-6">
<div class="form-group">
<label>Título</label>
<input name="titulo" class="form-control"
ng-model="foto.titulo" required
ng-maxlength="20">
<span ng-show = "formulario.$submitted && formulario.titulo.$error.required"
class="form-control alert-danger">
Título obrigatório
</span>
<span ng-show="formulario.$submitted && formulario.titulo.$error.maxlength" class="form-control alert-danger">
No máximo 20 caracteres!
</span>
</div>
<div class="form-group">
<label>URL</label>
<input name="url" class="form-control"
ng-model="foto.url" required>
<span ng-show = "formulario.$submitted && formulario.url.$error.required"
class="form-control alert-danger">
URL obrigatória
</span>
</div>
<div class="form-group">
<label>Descrição</label>
<textarea name="descricao" class="form-control" ng-model="foto.descricao">
</textarea>
</div>
<button type="submit" class="btn btn-primary" ng-disabled="formulario.$invalid">
Salvar
</button>
<a href="/" class="btn btn-primary">Voltar</a>
<hr>
</div>
<div class="col-md-6">
<minha-foto url="{{foto.url}}" titulo="{{foto.titulo}}">
</minha-foto>
</div>
</form>foto-controller.js
angular.module('alurapic')
.controller('FotoController', function($scope, $http) {
$scope.foto = {};
$scope.mensagem ='';
$scope.submeter = function() {
if ($scope.formulario.$valid) {
$http.post('/v1/fotos', $scope.foto)
.sucess(function() {
$scope.foto = {};
$scope.mensagem = 'Foto cadastrada com sucesso';
})
.error(function(erro){
console.log(erro);
$scope.mensagem = 'Não foi possivel incluir a foto';
});
}
};
});index.html
<!DOCTYPE html>
<html lang="pt-br" ng-app="alurapic">
<head>
<meta charset="UTF-8">
<base href="/">
<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">
<link rel="stylesheet" href="css/efeitos.css">
<script src="js/lib/angular.min.js"></script>
<script src="js/lib/angular-animate.min.js"></script>
<script src="js/lib/angular-route.min.js"></script>
<script src="js/main.js"></script>
<script src="js/controllers/fotos-controller.js"></script>
<script src="js/controllers/foto-controller.js"></script>
<script src="js/directives/minhas-diretivas.js"></script>
</head>
<body>
<div class="container">
<ng-view></ng-view>
</div> <!-- fim container -->
</body>
</html>principal.html
<div class="jumbotron">
<h1 class="text-center">Alurapic</h1>
</div>
<!-- novidade, a row com o campo de busca -->
<div class="row">
<div class="col-md-12">
<form>
<div class="input-group">
<span class="input-group-btn">
<a href="fotos/new" class="btn btn-primary">Nova foto</a>
</span>
<input ng-model="filtro" ng-model-options="{ debounce: 500}"
class="form-control" placeholder="filtrar">
</div>
</form>
</div> <!-- fim col-md-12 -->
</div> <!-- fim row -->
<div class="row">
<meu-painel class="col-md-2 painel-animado" ng-repeat="foto in fotos |
filter: filtro" titulo="{{foto.titulo}}">
<minha-foto url="{{foto.url}}" titulo="{{foto.titulo}}">
</minha-foto>
<!--<img class="img-responsive center-block" src="{{foto.url}}" alt="{{foto.titulo}}"> -->
</meu-painel> <!-- fim do painel -->
</div> <!-- fim row -->Sobre a diretiva minha-foto eu tinha feito, mas tirei porque no curso de JavaScript tinha exercícios que eu tinha feito, mas não estava sendo usado no projeto logo acabei tirando isso. Por causa de exercícios de outros cursos acabei não deixando mais os exercícios no projeto por isso que perguntei se teria mais alguma coisa para acrescentar.
Flavio voce poderia me ajudar ? não consegui achar porque nao esta limpando a tela e por causa disso nao esta mostrando as mensagens que voce coloca no final do video.
Ja achei o meu erro, eu coloquei sucess e o correto é success. Por causa disso ele nao estava limpando a tela e estava dando o erro no metodo get e mostrando as mensagens.