我有一个 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,并且所有代码都必须让我们then
与Promise进行交互。我宁愿等到 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>
数据.js:
var dataForMyService = {
// myData here
};
然后它在初始化时可用MyService
:
myModule.service('MyService', function() {
var myData = dataForMyService;
return {
doStuff: function () {
return myData.getSomeData();
}
};
});
这也可以,但是我有一个全局 javascript 变量,它闻起来很糟糕。
这些是我唯一的选择吗?这些选项之一是否比其他选项更好?我知道这是一个很长的问题,但我想表明我已尝试探索所有选项。任何指导将不胜感激。