AngularJSでWeb APIデータを永続化する方法

Question

Web API呼び出しを使用してサーバーからデータを取得するためのサービスとしてファクトリを作成しましたが、同じデータを再度取得する必要がある場合は、他の場所で同じデータを使用し、Web APIコールを再度作成する必要はありません。

角度jでデータを保持する方法はありますか？

Answer 1

方法：サービス

を使用して

1.我々はsetとgetに、その後controllersとの間でデータをサービスを作成することができますそのサービスを使用したいコントローラ機能に挿入します。

サービス：

app.service('setGetData', function() { 
    var data = ''; 
    getData: function() { return data; }, 
    setData: function(requestData) { data = requestData; } 
}); 

コントローラ：

app.controller('myCtrl1', ['setGetData',function(setGetData) { 

    // To set the data from the one controller 
    var data = 'Hello World !!'; 
    setGetData.setData(data); 

}]); 

app.controller('myCtrl2', ['setGetData',function(setGetData) { 

    // To get the data from the another controller 
    var res = setGetData.getData(); 
    console.log(res); // Hello World !! 

}]); 

ここで、我々はmyCtrl1は、データを設定するために使用され、myCtrl2がデータを取得するために使用されていることがわかります。したがって、これ以上のAPI呼び出しを行わずに、controllerのデータをanother controllerに共有することができます。保存し、キーに基づいて保存されたセッションのデータを返します工場出荷時のサービスを作成し、セッションストレージ

を使用して

2.。

app.factory('storageService', ['$rootScope', function($rootScope) { 

    return { 
     get: function(key) { 
      return sessionStorage.getItem(key); 
     }, 
     save: function(key, data) { 
      sessionStorage.setItem(key, data); 
     } 
    }; 
}]); 

コントローラ：

setとgetにセッションストレージからデータをコントローラにstorageService依存性を注入します。

app.controller('myCtrl',['storageService',function(storageService) { 

    // Save session data to storageService 
    storageService.save('key', 'value'); 

    // Get saved session data from storageService 
    var sessionData = storageService.get('key'); 

}); 

Answer 2

これにはHTML5 Web Storageを使用できます。あなたがあなたのサービス内の非同期呼び出しを作っているとあなたがフェッチしているデータが「静的」である場合に

localStorage.setItem("lastname", "Smith"); 
console.log(localStorage.getItem("lastname")); 

Answer 3

それは、新たなオーバーヘッドにあなたがそれらを必要とするたびを避けるために、それらをキャッシュする意味があります。キャッシュはデフォルトで無効になっています。アプリケーション間でデータを共有する

$http({ 
method: 'GET', 
cache: true 
}