1

Partindo da ideia que os services são singletons (All Services are singletons), se eu criar um service simples com variáveis "locais" e modifique essa em um controller, ao acessar esse valor em outro controller, ele deveria manter o valor, né?

Exemplo:

angular.module("app", []);
angular.module("app").service("service", function() {
  
  var _count = 0;
  
  this.incrementCount = function() {
      _count ++;
      console.log(_count);
  };
  
});

angular.module("app").controller("ctrl1", function($scope, service) {
  $scope.increment = function() {
      service.incrementCount();
   }
});

angular.module("app").controller("ctrl2", function($scope, service) {
   $scope.increment = function() {
      service.incrementCount();
   }
});
<!DOCTYPE html>
<html ng-app="app">
<head>
	<title></title>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body>
  
  <div ng-controller="ctrl1">
  
    <button ng-click="increment()" value="ctrl1" >Ctrl1 </button> 
    
  </div>

   <div ng-controller="ctrl2">
  
      <button ng-click="increment()" > Ctrl2 </button> 
     
  </div> 
  
</body>
</html>

Nesse exemplo, se analisar o console, ele incrementa o valor correto independente do controller que estiver, porém, no meu caso, acontece que eu só tenho um controller na pagina e quando vou para a próxima pagina (sem manter o template), esse valor reinicia em 0.

O modo em que faço pro sistema ir pra outra pagina é usando o objeto window: window.location.href = "views/player.html"

Faço desse modo porque minha aplicação roda em protocolo FILE e não consegui, pelo menos ainda, fazer de outro jeito, o que me impede de usar de templates (pelo menos não consegui usa-los).

Esse é mesmo o comportamento esperado?

2
  • Com ir para próxima página, sem manter o template, o que você quer dizer? É um redirecionamento pelo Angular utilizando $location? 11/11/2015 às 14:02
  • Acabei de editar quando vi que faltou essa informação. É utilizando o objeto window. Por algum motivo, não consegui fazer ele ir pra outro página usando o $location em protocolo file 11/11/2015 às 14:04

2 Respostas 2

4

Eo acessar esse valor em outro controller, ele deveria manter o valor, né?

Correto, se este service consumido estiver sob o mesmo contexto. Se, por exemplo, você possuir a seguinte estrutura:

<div ng-app='app1'>
    <div ng-controller='ctrl1'>
    </div>
</div>
<div ng-app='app2'>
    <div ng-controller='ctrl2'>
    </div>
</div>

E tanto ctrl1 e ctrl2 consumirem o mesmo serviço, seus valores irão divergir por estarem em duas aplicações diferentes; os singletons gerados para prover o serviço são distintos.

Quando você usa window.location.href, você está destruindo o contexto atual e criando um novo.

Uma possibilidade que talvez você queira explorar seria ngInclude, que permite a carga dinâmica de conteúdo parcial mantendo o escopo corrente. Assim:

<div ng-include="views/player.html">
6
  • Obrigado pela dica! Vou dar uma pesquisada no ng-include e qualquer coisa dou um grito aqui 11/11/2015 às 15:51
  • 1
    @PauloGustavo boa sorte!
    – OnoSendai
    11/11/2015 às 16:55
  • Opa, desculpa a demora por um retorno. Por falta de tempo, acabei colocando no protocolo HTTP afins de fazer testes só. Agora que votei com esse problema, tentei fazer usando o ng-include, como sugeriu. Eu coloquei dentro do meu index, o código "div ng-include="views/progressBar">. porém, quando vou dar um inspect no html, ele aparece comentado puu.sh/lr5D8/60f2293955.png . Você sabe por que? 19/11/2015 às 13:23
  • Ah, o problema é que faltava aspas simples. Mas de qualquer modo, parece que o navegador não permite isso, ele da o seguinte erro: XMLHttpRequest cannot load file:///C:/Desenvolvimento/workspace/BSSJs/views/progressBars.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource. 19/11/2015 às 13:34
  • @PauloGustavo olá! Isto pode estar acontecendo porque você está executando seu projeto via um servidor web (IIS, Apache, etc.) via http ou https e tentando carregar o arquivo diretamente via protocolo file:, e isso viola o as regras do CORS. Tente utilizar uma URL relativa.
    – OnoSendai
    19/11/2015 às 13:37
3

Ao efetuar uma troca utilizando window.location, o que acontece é uma troca de página pelo navegador, sendo assim, toda a aplicação angular é recarregada e os valores zerados. É como abrir tudo do zero.

Para manter o estado da aplicação, utilize o serviço de $location que o angular provê. Documentação aqui: https://docs.angularjs.org/api/ng/service/$location

3
  • Hmmmm, interessante. Usando o window.location, como você disse, faz ele recarregar tudo.. mas o que acontece com as coisas que estão na memoria ? O AngularjS tenta forçar o GC a limpar ? Algo assim? E sobre o uso do $location, você sabe dizer se é possível utilizar ele normalmente no protocolo file? 11/11/2015 às 14:09
  • O Angular não faz nada de gc, o navegador faz isso jogando tudo fora, sem nem questionar o angular e passando para a próxima página. O que seria o protocolo file? 11/11/2015 às 14:10
  • Não sei definir ele muito bem, mas de ligeira, é abrir um arquivo html no teu computador pelo brower. É o file:// 11/11/2015 às 16:49

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .