AngularJSアプリケーションでmy $ scope属性がリセットされ続けるのはなぜですか？

Question

テンプレート（index.html）、アプリ定義（）、コントローラ定義（controllers.js）、ホスティングページ（host.jsp）で構成される次のAngularJSアプリケーションがあります。

<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をホスト

search.jspを次のよう

コードです。 jspは簡潔に表示されておらず、ヴァンス。

コントローラーはAjaxリクエストから何らかのデータを取得し、$scopeにそのデータの一部を格納し、再度要求しないようにしてユーザーに表示し、入力を待ちます。ユーザーがビュー内のデータを選択すると、URL変更部分を更新して選択の変更を反映します。しかし、データが$scopeで利用可能かどうかをチェックすることによって、その後のAjaxリクエストを回避したいと思います。

私が直面している問題は、$scope.myAttributeが常に定義されていないことです。リクエストごとにリセットされます。私はAngularJSを悪用していると思う。どんな手掛かり？

Answer 1

コントローラを離れると、スコープは破棄されます。私はあなたが望むものを保管するサービスを作ることに目を向けるでしょう。

angular.module('MyApp', []). 
    config(['$routeProvider', function($routeProvider) { 
    $routeProvider. 
     when('/', {templateUrl:'/index.html', controller: MyController}). 
     otherwise({redirectTo: '/'}); 
}]) 
.service("myService", function(){ 
    this.myAttribute = null; 
}); 

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

サービスは、複数のコントローラ/ディレクティブ間で日付を共有するために使用されるので、私はあなたが望むものだと確信しています。

ここではそれらのドキュメント情報があります：http://docs.angularjs.org/guide/dev_guide.services.creating_services

Answer 2

あなたが存続したい情報を格納するサービス（または$ rootScope）を使用する必要があります。 サービスはシングルトンであり、コントローラにそれらを挿入することができます。そこに設定したものは、アプリケーションにそのまま残ります。

$スコープは、ルートを変更しても保持されないようにすると削除されます。ここで

は一例です：

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 
}]; 

また、私は（代わりに、あなたの中にそれを持つのコントローラ）AJAXを経由して必要な値を取得するために、サービス内の関数を作成したいので、サービスがものになるだろうlike：

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; 
});