如何創建一個Angular工廠服務來訪問ASP.NET服務器端緩存

Question

我們正在創建一個使用AngularJS框架的ASP.NET MVC應用程序。這是一個多語言應用程序，每種語言的資源值都存儲在數據庫中。

在服務器端，當用戶登錄到應用程序並在整個視圖中使用它時，我們將所有資源從數據庫加載到HttpRuntimeCache中。

我們想要創建一個AngularJS工廠服務，我們可以使用它來訪問HttpRuntimeCache中的資源。

例如：

1. 用戶點擊登錄
2. ASP.NET MVC的應用程序加載到資源HttpRuntimeCache
3. 用戶被重定向到應用（家庭/索引）的根。
4. 角應用程序初始化
5. 當用戶查看來自HttpRuntimeCace需要這些資源的網頁，我們將通過服務
   • 獲得的價值。當這個服務被調用時，它會首先檢查它是否已加載資源字典
   • 如果它尚未加載，它將調用MVC操作方法，該方法將返回資源字典爲JSON，並且服務將使用該響應來加載字典
   • 如果它已被加載，它只會基於t從字典中返回值他鍵入已要求

什麼是實現此方案的最佳方式？

以下是我們目前爲止的內容。我們目前的解決方案存在的問題是，在字典有機會加載之前，服務正在返回值。

angular.module("MyApp").factory('cacheService', ['$rootScope', '$http', function ($rootScope, $http, $q) { 
    var obj = { resourcesLoaded: false }; 

    obj.loadResourceDictionary = function() { 
     obj.resourcesLoaded = false; 

     $http.get("/MyApp/Cache/GetResourceDictionary") 
      .success(function (data) { 
       obj.resourceDictionary = data; 
       obj.resourcesLoaded = true; 
      }); 
    } 

    obj.getResourceValue = function (resourceKeyName) { 
     if (!obj.resourcesLoaded) { 
      obj.loadResourceDictionary(); 
     } 
     return obj.resourceDictionary[resourceKeyName]; 
    } 

    return obj; 
}]); 

編輯W的角控制器/使用實例（我們也希望在一個指令以使用這項服務）：

angular.module("MyApp").controller("MyAppCtrl", ['cacheService', function (cacheService) { 
    var self = this; 
    self.test = function() { 
     var value = cacheService.getResourceValue('Err_lbl_UserExist'); 
    } 
}]); 

<div ng-controller="MyAppCtrl as myAppCtrl"> 
    <button ng-click="myAppCtrl.test()">Test Angular CacheService</button> 
</div> 

Answer 1

你去那裏：

angular.module("MyApp").factory('cacheService', ['$rootScope', '$http', function ($rootScope, $http, $q) { 
    var service = { 
    obj.getResourceValue = function() { 
     return $http.get("/MyApp/Cache/GetResourceDictionary") 
      .success(function (data) { 
       return data 
      }); 
    } 
    } 
    return service; 
}]); 

而對於您的控制器方法：

angular.module("MyApp").controller("MyAppCtrl", ['cacheService', function (cacheService) { 
    var self = this; 
    self.test = function() { 
     var value = null; 
     cacheService.getResourceValue().then(function (data){ 
       value = data['Err_lbl_UserExist']; 
     } 
    } 
}]); 

<div ng-controller="MyAppCtrl as myAppCtrl"> 
    <button ng-click="myAppCtrl.test()">Test Angular CacheService</button> 
</div> 

$ http.get是一個異步函數，因此會阻塞，直到收到數據。你所要做的就是處理沒有實現的錯誤。