2016-06-08 3 views
0

Dies ist eine ASP.NET MVC-App mit AngularJS.So laden Sie Daten aus einem Factory-Dienst, bevor Sie sie in der Anwendung verwenden

Wenn die Anwendung geladen wird, müssen wir eine Aktionsmethode aufrufen, die ein Wörterbuch der Ressourcen zurückgibt, Zeichenfolge Schlüssel Zeichenfolge Wert.

Dieses Array/Wörterbuch von Ressourcen muss in der gesamten Anwendung verfügbar sein.

Wie können wir warten, bis diese Ressourcen geladen sind, bevor Sie auf sie innerhalb der Anwendung zugreifen?

var app = angular.module("app", []); 

app.controller("TestCtrl", ['cacheService', function (cacheService) { 
    var self = this; 
    self.test = function() { 
     var value = cacheService.getResourceValue('Err_lbl_UserExist'); 
    } 
}]); 

app.factory('cacheService', ['$http', function ($http) { 
    var obj = {}; 
    obj.resourceDictionary = []; 

    obj.loadResourceDictionary = function() { 
     var httpConfig = { 
      url: "/Cache/GetResourceDictionary", 
      method: "GET", 
      headers: { 
       "X-Requested-With": 'XMLHttpRequest', 
       "__RequestVerificationToken": $("[name=__RequestVerificationToken]").val() 
      } 
     } 
     $http(httpConfig) 
      .success(function (data) { 
       obj.resourceDictionary = data; 
      }); 
    } 

    obj.getResourceValue = function (resourceKeyName) { 
     if (obj.resourceDictionary.length <= 0) { 
      obj.loadResourceDictionary(); 
     } 

     return obj.resourceDictionary[resourceKeyName]; 
    } 
    return obj; 
}]); 

EDIT w/akzeptierte Antwort

var app = angular.module("app", []); 

app.controller("TestCtrl", ['cacheService', function (cacheService) { 
    var self = this; 
    self.test = function() { 
     var value = cacheService.getResourceValue('Err_lbl_UserExist'); 
    } 
}]); 

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

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

     var httpConfig = { 
      url: "Cache/GetResourceDictionary", 
      method: "GET", 
      headers: { 
       "X-Requested-With": 'XMLHttpRequest', 
       "__RequestVerificationToken": $("[name=__RequestVerificationToken]").val() 
      } 
     } 

     $http(httpConfig).success(function (data) { 
      obj.resourceDictionary = data; 
      obj.resourcesLoaded = true; 
      $rootScope.$broadcast("ResourcesLoaded", null); 
     }); 
    } 

    obj.getResourceValue = function (resourceKeyName) { 
     if (!obj.resourcesLoaded) { 
      obj.loadResourceDictionary(); 
      $rootScope.$on("ResourcesLoaded", function() { 
       return obj.resourceDictionary[resourceKeyName]; 
      }); 
     } else { 
      return obj.resourceDictionary[resourceKeyName]; 
     } 
    } 

    return obj; 
}]); 

Antwort

1

Sie Sendung und auf dafür nutzen könnten.

Also, wenn Sie Ihre Schlüssel geladen werden Sie ein Ereignis Sendung

https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope # $ Broadcast

Sie für diese Nachricht hören mit Feuer, wo immer Sie mit auf benötigen:

https://docs.angularjs.org/api/ng/type/ $ rootScope.Scope # $ auf

Sie können die Daten in einem Dienst speichern, dies wi Machen Sie es zu einem Singleton und Sie können es wiederverwenden, alles, was Sie tun müssen, ist den Service in den Controller zu injizieren, den Sie brauchen.