Dlaczego moje atrybuty $ scope resetują się w mojej aplikacji AngularJS?

Question

Mam następującą aplikację AngularJS składającą się z szablonu (index.html), definicji aplikacji (app.js), definicji kontrolera (controllers.js) i strony hostingu (host.jsp).

Kod jest w następujący sposób:

search.jsp

<div class="container-fluid" ng-app="facetedSearch"> 
    <div class="row-fluid" ng-view> 
    </div> 
</div> 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.min.js"></script> 
<script src="/resources/js/page/search/app.js"></script> 
<script src="/resources/js/page/search/controllers.js"></script> 

app.js

angular.module('MyApp', []). 
    config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
    when('/', {templateUrl:'/index.html', controller: MyController}). 
    otherwise({redirectTo: '/'}); 
}]); 

controller.js

var MyController=['$scope','$http','$location',function ($scope, $http, $location) { 
    //do some fancy stuff 
    if($scope.myAttribute===undefined){ 
     $scope.myAttribute=someDataFromHttpRequest; 
    } 
    $location.search(someParameters); 
}]; 

index.html i gospodarza. jsp nie są pokazane dla zwięzłości i nie mają znaczenia vance.

Sterownik pobiera pewne dane z żądania Ajax, przechowuje niektóre z nich w $scope, aby uniknąć żądania ponownego i pokazuje je użytkownikowi i czeka na dane wejściowe. Gdy użytkownik wybierze niektóre dane w widoku, zaktualizuję część zapytania adresu URL, aby odzwierciedlić zmiany wyboru. Ale chcę uniknąć kolejnych żądań Ajax, sprawdzając, czy dane są dostępne w $scope.

Problem, przed którym stoję, polega na tym, że $scope.myAttribute jest zawsze niezdefiniowany. Resetuje się na każde żądanie. Myślę, że niewłaściwie używam AngularJS. Jakaś wskazówka?

Answer 1

Po opuszczeniu kontrolera zasięg zostaje zniszczony. Zajmę się tworzeniem usługi przechowującej potrzebne rzeczy.

Usługi są używane do dzielenia daty pomiędzy wieloma kontrolerami/dyrektywami, więc jestem prawie pewien, że tego właśnie chcesz.

Oto informacja doc na nich: http://docs.angularjs.org/guide/dev_guide.services.creating_services

Answer 2

Należy korzystać z usług (lub $ rootScope) do przechowywania informacji, które chcesz utrzymywać. Usługi są pojedyncze i możesz je wprowadzić do kontrolerów, wszystko, co tam ustawisz, pozostanie w aplikacji.

Zakresy są usuwane po zmianie trasy, aby nie były trwałe.

Oto przykład:

var myApp = angular.module('myApp',[]); 
myApp.factory('SomeService', function() { 
    return { 
     myAttribute : '12345' 
    }; 
}); 

var MyController=['$scope','$http','$location', 'myService', 'SomeService',function ($scope, $http, $location, myService, SomeService) { 
    //do some fancy stuff 
    SomeService.myAttribute; //this is how you access myAttribute 
}]; 

Również bym utworzyć funkcję wewnątrz serwisu, aby pobrać żądane wartości za pośrednictwem AJAX (zamiast go wewnątrz ty Controller), więc obsługa byłoby coś na przykład:

myApp.factory('SomeService', function() { 

    var SomeService = {}; 

    var myAttribute; 

    SomeService.getMyAttribute = function() { 

     if(!myAttribute) { 

      //run ajax request then populate and return myAttribute 

     } 
     return myAttribute; 
    }; 
    return SomeService; 
});