いくつかの非同期データで初期化したい AngularJS サービスがあります。このようなもの:
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();
}
};
});
何かが戻ってくるdoStuff()
前に呼び出そうとすると、ヌルポインタ例外が発生するため、明らかにこれは機能しません。こことここでmyData
尋ねられた他の質問のいくつかを読んでわかる限り、いくつかのオプションがありますが、どれもあまりきれいに見えません(おそらく何かが欠けています):
「実行」によるサービスのセットアップ
アプリをセットアップするときは、次のようにします。
myApp.run(function ($http, MyService) {
$http.get('data.json').success(function (data) {
MyService.setData(data);
});
});
次に、私のサービスは次のようになります。
myModule.service('MyService', function() {
var myData = null;
return {
setData: function (data) {
myData = data;
},
doStuff: function () {
return myData.getSomeData();
}
};
});
これは時々機能しますが、非同期データがたまたますべてが初期化されるよりも時間がかかる場合、呼び出し時にヌルポインター例外が発生しますdoStuff()
promise オブジェクトを使用する
これはおそらくうまくいくでしょう。どこでも MyService を呼び出す唯一の欠点は、 doStuff() が promise を返し、すべてのコードが promise とthen
対話する必要があることを知る必要があることです。アプリケーションをロードする前に、myData が戻ってくるまで待ちたいと思います。
手動ブートストラップ
angular.element(document).ready(function() {
$.getJSON("data.json", function (data) {
// can't initialize the data here because the service doesn't exist yet
angular.bootstrap(document);
// too late to initialize here because something may have already
// tried to call doStuff() and would have got a null pointer exception
});
});
グローバル Javascript Var JSON をグローバル Javascript 変数に直接送信できます。
HTML:
<script type="text/javascript" src="data.js"></script>
data.js:
var dataForMyService = {
// myData here
};
その後、初期化時に利用可能になりますMyService
:
myModule.service('MyService', function() {
var myData = dataForMyService;
return {
doStuff: function () {
return myData.getSomeData();
}
};
});
これも機能しますが、悪臭を放つグローバル javascript 変数があります。
これらは私の唯一のオプションですか?これらのオプションの 1 つは、他のオプションよりも優れていますか? これがかなり長い質問であることは承知していますが、すべての選択肢を検討しようとしたことを示したいと思います。任意のガイダンスをいただければ幸いです。