我编写了一个服务,它应该在第一次调用服务器时填充数据,然后将其保存在内存中并返回相应的时间。因为我也想在ui-Router中使用它,它应该返回一个promise。
这是服务:
(function () {
"use strict";
angular
.module("common.services")
.service("dataCache", ["tabResource", "fieldResource", "$q", "$http", dataCache]);
function dataCache(tabResource, fieldResource, $q, $http) {
var self = this;
self.tabs = null;
var getTabs = function () {
// create deferred operation
var deferred = $q.defer();
if (self.tabs !== null) {
toastr.warning("tabs from cache");
deferred.resolve(self.tabs);
} else {
// get the data from the server
$http.get('http://localhost:40000/api/tab')
.then(function(response) {
self.tabs = response.data;
deferred.resolve(self.tabs);
toastr.warning("tabs from server");
}, function (response) {
deferred.reject(response);
});
}
return deferred.promise;
};
return {
tabs: getTabs()
};
}
}());
这些是不同的状态,其中'标签'使用:
.state("relationCustom", {
url: "/relations/customisation",
templateUrl: "webApp/relations/relationCustomView.html",
controller: "RelationCustomCtrl as vm",
resolve: {
tabResource: "tabResource",
fieldResource: "fieldResource",
// tabs: function (tabResource) {
// return tabResource.query({}, function () { toastr.success('Tabs geladen...'), function () { toastr.error('Tabs laden MISLUKT!') } }).$promise;
//}
tabs: function (dataCache) {
return dataCache.tabs;
}
, fields: function (fieldResource) {
return fieldResource.query({}, function () { toastr.success('Velden geladen...'), function () { toastr.error('Tabs laden MISLUKT!') } }).$promise;
}
}
})
.state("relationDetailTab", {
url: "/relations/:customerName/:relId/:tabId",
templateUrl: "webApp/relations/relationDetailTabView.html",
controller: "RelationDetailTabCtrl as vm"
,
resolve: {
relationTabResource: "relationTabResource",
relationTab: function (relationTabResource, $stateParams) {
var relId = $stateParams.relId;
var tabId = $stateParams.tabId;
return relationTabResource.query({ id: relId, id2: tabId }).$promise; // query expects array <-> get expects object
}
//, tabs: function (tabResource, dataCache) {
// return tabResource.query({}, function () { toastr.success('Tabs geladen...'), function () { toastr.error('Tabs laden MISLUKT!') } }).$promise;
//}
, tabs: function (dataCache) {
return dataCache.tabs;
}
, fields: function (fieldResource, dataCache) {
return fieldResource.query({}, function () { toastr.success('Velden geladen...'), function () { toastr.error('Tabs laden MISLUKT!') } }).$promise;
}
}
})
.state("relationDetailTabEdit", {
url: "/relations/:customerName/:relId/:tabId/edit",
templateUrl: "webApp/relations/relationDetailTabEditView.html",
controller: "RelationDetailTabEditCtrl as vm",
resolve: {
relationTabResource: "relationTabResource",
relationTab: function (relationTabResource, $stateParams) {
var relId = $stateParams.relId;
var tabId = $stateParams.tabId;
return relationTabResource.query({ id: relId, id2: tabId }).$promise; // query expects array <-> get expects object
}
//, tabs: function (tabResource) {
// return tabResource.query({}, function () { toastr.success('Tabs geladen...'), function () { toastr.error('Tabs laden MISLUKT!') } }).$promise;
//}
, tabs: function (dataCache) {
return dataCache.tabs;
}
, fields: function (fieldResource) {
return fieldResource.query({}, function () { toastr.success('Velden geladen...'), function () { toastr.error('Tabs laden MISLUKT!') } }).$promise;
}
}
});
$urlRouterProvider.otherwise("/"); // Default route
}]);
我确实在服务代码的各行上设置了断点,并且只在第一次加载应用程序时才输入代码。当我去另一个州时,似乎没有任何服务代码被执行。谁能解释一下为什么?但更奇怪的是,当我将新标签保存到服务器时,它会自动显示在“标签”中。在其他州,显然(根据提琴手)没有服务回叫服务器。我很高兴一切正常,但我真的很想了解......
答案 0 :(得分:0)
最后它不是一个有角度的问题,而是一个javascript问题。在评论的帮助下,我解决了这个问题。
服务代码的变化:
return {
tabs: getTabs
};
州的变化:
tabs: function (dataCache) {
return dataCache.tabs();
}
这样,该函数实际上是在状态
的解析块中调用的