Ich habe einen AngularJS-Dienst, den ich mit einigen asynchronen Daten initialisieren möchte. Etwas wie das:
myModule.service('MyService', function($http) {
var myData = null;
$http.get('data.json').success(function (data) {
myData = data;
});
return {
setData: function (data) {
myData = data;
},
doStuff: function () {
return myData.getSomeData();
}
};
});
Offensichtlich wird dies nicht funktionieren, weil wenn etwas versucht, doStuff()
aufzurufen, bevor myData
zurückkommt, werde ich eine Nullzeiger-Ausnahme erhalten. So weit ich aus dem Lesen einiger der anderen gestellten Fragen hier und hier erkennen kann, habe ich ein paar Optionen, aber keine davon scheint sehr sauber zu sein (vielleicht übersehe ich etwas):
Service mit "run" einrichten
Wenn ich meine App einrichte, mache dies:
myApp.run(function ($http, MyService) {
$http.get('data.json').success(function (data) {
MyService.setData(data);
});
});
Dann würde mein Dienst so aussehen:
myModule.service('MyService', function() {
var myData = null;
return {
setData: function (data) {
myData = data;
},
doStuff: function () {
return myData.getSomeData();
}
};
});
Dies funktioniert manchmal, aber wenn die asynchronen Daten länger dauern als alles initialisiert wird, erhalte ich eine Nullzeiger-Ausnahme, wenn ich doStuff()
aufrufe
Versprechenobjekte verwenden
Dies würde wahrscheinlich funktionieren. Der einzige Nachteil ist, dass überall, wo ich MyService aufrufe, wissen muss, dass doStuff() ein Versprechen zurückgibt und der gesamte Code das verwenden muss then
, um mit dem Versprechen zu interagieren. Ich würde lieber einfach warten, bis myData zurück ist, bevor ich meine Anwendung lade.
Manuelles Bootstrapping
angular.element(document).ready(function() {
$.getJSON("data.json", function (data) {
// kann die Daten hier nicht initialisieren, weil der Dienst noch nicht existiert
angular.bootstrap(document);
// hier zu spät zu initialisieren, weil möglicherweise schon etwas versucht hat, doStuff() aufzurufen und eine Nullzeiger-Ausnahme erhalten hätte
});
});
Globaler Javascript-Var Ich könnte meine JSON direkt an eine globale Javascript-Variable senden:
HTML:
data.js:
var dataForMyService = {
// myData hier
};
Dann wäre es verfügbar, wenn MyService
initialisiert wird:
myModule.service('MyService', function() {
var myData = dataForMyService;
return {
doStuff: function () {
return myData.getSomeData();
}
};
});
Dies würde auch funktionieren, aber dann hätte ich eine globale Javascript-Variable, was nicht gut ist.
Sind das meine einzigen Optionen? Ist eine dieser Optionen besser als die anderen? Ich weiß, dass dies eine ziemlich lange Frage ist, aber ich wollte zeigen, dass ich versucht habe, alle meine Optionen zu erkunden. Jede Anleitung wäre sehr hilfreich.