我有一个基本服务,看起来像这样：
.service('BaseImageService',['$q','ApiHandler','UploadService',function ($q,api,uploadService) {
// Get our api path
var apiPath = 'logos';
// Creates our logo
var _createlogo = function (model) {
// Handle our uploads
return _handleUploads(model).then(function () {
// Create our logo
return api.post(apiPath,model);
});
};
// Edit our logo
var _editlogo = function (model) {
// Handle our uploads
return _handleUploads(model).then(function () {
// Create our logo
return api.put(apiPath,model);
});
};
// Handles our files
var _handleUploads = function (model) {
// Create a promises array
var promises = [];
// Get our file
var file = model.file,old = model.old;
// If we have a file
if (file) {
// Try to upload the file
promises.push(uploadService.upload(model.file).then(function (response) {
// Update our model
model.path = response.path;
model.thumbnail = response.thumbnail;
}));
// If we have an old model
if (old) {
// Delete both our files
promises.push(uploadService.delete(old.path));
promises.push(uploadService.delete(old.thumbnail));
}
}
// After all promises have completed
return $q.all(promises);
};
// Create our service
var service = {
// Update our api path
updateApiPath: function (path) {
// Set the api path
apiPath = path;
},// Gets a list of logos
list: function (t) {
if (t) {
console.log(apiPath);
}
// Get our logo
return api.get(apiPath);
},// Get a single logo
get: function (id) {
// Get our logo
return api.get(apiPath,{ id: id });
},// Create our logo
save: function (model) {
// If we are editing
if (model.id) {
// Edit our logo
return _editlogo(model);
// If we are creating
} else {
// Create our logo
return _createlogo(model);
}
},// Deletes our logo
delete: function (id) {
// Delete our logo
return api.delete(apiPath,// Prepare for editing
prepareForEditing: function (model) {
// Create our old object
model.old = {
path: model.path,thumbnail: model.thumbnail
};
}
};
// Return our service
return service;
}])
然后我有一些“继承”这项服务的服务,如下所示：
.service('ImageService',['BaseImageService',function (baseService) {
// Get our api path
var apiPath = 'images';
// Update the apiPath
baseService.updateApiPath(apiPath);
// Return our service
return baseService;
}])
.service('logoService',function (baseService) {
// Get our api path
var apiPath = 'logos';
// Update the apiPath
baseService.updateApiPath(apiPath);
// Return our service
return baseService;
}])
.service('PlayerTextService',function (baseService) {
// Get our api path
var apiPath = 'playerText';
// Update the apiPath
baseService.updateApiPath(apiPath);
// Return our service
return baseService;
}])
我认为这很好用.但我有这个页面顺序调用所有3个服务(ImageService,logoService和PlayerTextService).在页面的第一个视图上一切都很好,如果我离开然后回来图像服务实际上从播放器文本服务拉回东西.现在我知道这是因为服务是单身,但我不知道如何解决我的问题.
任何人都可以帮我一把吗？
http://codepen.io/r3plica/pen/ONVBJO
尝试2
解决方法
您尝试的解决方案不起作用,因为BaseService是一个单例.因此,您将完全相同的实例注入所有三个服务注册函数,并且所有这些函数都配置相同的对象.所以基本上最后一个赢了.
看起来您希望使用不同配置的单独服务.这就是供应商的用途.它们允许构建服务实例的两步过程.请查看关于该主题的这个伟大的Stackoverflow答案：
AngularJS: Service vs provider vs factory
作为参考,Restangular是一个需要完全相同的库.您可以将其用作蓝图,并查看Restangular如何处理此要求：
请注意,这些概念基于AngularJS 1,如果您希望稍后使用AngularJS 2,则需要以不同方式处理.
