O AngularJS ja um dos Framework mais utilizado no mercado, hoje vou apresentar como implementar um Spinner, uma animacao enquanto o usuario aguarda o final do processamento. O Spinner que iriei utilizar e uma directive do proprio AngularJS, assim nao sera necessario imagens ou Gifs.Podemos dizer que o Spinner e muito utilizado nas telas atualmente, assim o usuario podera saber que algo esta ocorrendo enquanto ele esta aguardando, o que fica muito estranho quando uma pagina nao exibe nada e voce fica esperando.O codigo que irei implementar e bastante simples, meu exemplo e apenas em um botao em que ira ativar o Spinner, assim voce saber o que devera implementar na sua tela.<html> <head> <!-- AngularJS --> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.0-rc.0/angular.min.js"></script> <!--Spinner --> <script src="http://cdnjs.cloudflare.com/ajax/libs/spin.js/2.0.1/spin.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/angular-spinner/0.5.1/angular-spinner.js"></script> </head> <body ng-app="appExemplo" ng-controller="exemploController"> <!-- Spinner --> <div ng-if="processando" us-spinner></div> <!--Botao para ativar ou desativar o Spinner --> <button ng-click="ativar()"> Ativar </button> <script> var appExemplo = angular.module('appExemplo', ['angularSpinner']); //Criando o controller appExemplo.controller('exemploController', function ($scope) { //Criando o metodo Ativar $scope.ativar = function(){ //Exibe ou nao o Spinner $scope.processando= !$scope.processando; }; }); </script> </body></html>Vamos a explicacao do codigo acima:Os 3 scripts importados no head sao do Angular e os dois ultimos do Spinner.<div ng-if="processando" us-spinner></div> - Iremos exibir o Spinner quando o processando estiver true.<button ng-click="ativar()"> Ativar </button> - Criamos um botao para chamar o metodo Ativar, esse botao ira atualizar a variavel processando para true ou false.var appExemplo = angular.module('appExemplo', ['angularSpinner']); - Estamos criando nosso appExemplo e importando nosso angularSpinner.$scope.ativar = function(){ $scope.processing = !$scope.processing;}; - Criamos nosso metodo Ativar que ira ser chamado pelo botao, ativando ou desativando a variavel processando para exibir o Spinner.Agora que criamos um botao para chamar o spinner, para que entao seja exibido o spinner ao realizar algum processamento, o codigo ficara da seguinte maneira:$scope.ativar = function(){ //Exibe o spinner no inicio do processamento $scope.processando= true; //Meio do codigo que devera ser processado, podendo ser uma chamada ao banco, etc. //Retira o spinner $scope.processando= false; };No codigo acima, sempre que um houver um processamento, o spinner sera exibido e depois retiramos ao final do processamento.Baixe o exemplo aqui.Ate a proxima.Abracos Neste post vou mostrar como fazer uma chamada Ajax utilizando o framework MVC4, no exemplo iremos carregar o combo cidades a partir do estado selecionado e seu retorno sera em formato JSON.Em nosso exemplo o usuario ira selecionar o combo de Estadose entao serao carregadas as cidades correspondentes, para isso iremos utilizara tecnologia MVC4 com Ajax e o retorno da nossa lista de cidades sera no formato JSON.Primeiro vamos criar um novo projeto em File > New> Project...E entao selecionar a opcao ASP.NET MVC4 Web Application, no campo Name informe "Exemplo1" e entao OK, a imagem abaixo ilustra o exemplo:Criaremos a classe Estado em Models na seguinte estrutura: public class Estado { public String Uf { get; set; } public String Nome { get; set; } }Criando a classe Cidade: public class Cidade { public String Uf { get; set; } public String Nome { get; set; } }No controller Home (HomeController.cs) criaremos dois metodos, um que ira preenchera lista de