AngularJs 范围独立的服务
AngularJs Services with isolated scope
在我的 Angular 应用程序中,我有一个服务,它存储一个配置结构,供我的应用程序的各个组件使用。在 .run
阶段,guiConfigService
通过函数 setGuiConfig
从 .json
文件中读取配置,并且能够通过 return 某个组件的数据函数 getGuiConfig
:
myApp.factory("guiConfigService", ['$http', function($http) {
var guiConfig = {};
var self = {
setGuiConfig: function (callback) {
guiConfig = {"Functions" : {
"FunctionIds" : [
"3",
"5",
"10",
"last_entry"
]
}};
if (undefined !== callback) {
callback(guiConfig);
}
},
getGuiConfig: function (buzzword, callback) {
callback(guiConfig[buzzword]);
}
}
return self;
}]);
我的问题:
在我的组件的控制器中,我希望能够操纵我从服务的 getGuiConfig
函数返回的任何内容,比方说,我想删除属性的最后一个条目 FunctionIds
.这种操作不仅会影响我的控制器中的对象,还会操作我的服务中的 guiConfig
-Object。
function MyCtrl($scope, guiConfigService) {
var configData;
$scope.getNewGuiConfig = function() {
guiConfigService.getGuiConfig('Functions', function(data) {
configData = data;
// this does not only affect `configData`, but also the
// `guiConfig`-Object in guiConfigService:
configData.FunctionIds.splice(-1);
});
}
}
例如参见this JsFiddle。
我已经尝试过:
- 首先我想,问题是我调用了回调函数而不是直接 returning 对象,但我试过了,它似乎也不起作用。
- 通过
JSON.parse(JSON.stringify(guiConfig[buzzword]))
发送我的服务的 guiConfig
对象的副本正在工作,但在我看来这不是正确的方法。
有没有一种好方法 return 来自服务对象的数据,而不引用实际对象?
All the services are singleton in angular.So you can make a copy of config data in your controller and modify it accordingly.
According to me you should use constant service to store your app configurations and always make a copy of your configurations when you want to manipulate them using angular.copy().
function MyCtrl($scope, guiConfigService) {
var configData;
$scope.getNewGuiConfig = function() {
guiConfigService.getGuiConfig('Functions', function(data) {
configData = angular.copy(data);
configData.FunctionIds.splice(-1);
});
}
}
在我的 Angular 应用程序中,我有一个服务,它存储一个配置结构,供我的应用程序的各个组件使用。在 .run
阶段,guiConfigService
通过函数 setGuiConfig
从 .json
文件中读取配置,并且能够通过 return 某个组件的数据函数 getGuiConfig
:
myApp.factory("guiConfigService", ['$http', function($http) {
var guiConfig = {};
var self = {
setGuiConfig: function (callback) {
guiConfig = {"Functions" : {
"FunctionIds" : [
"3",
"5",
"10",
"last_entry"
]
}};
if (undefined !== callback) {
callback(guiConfig);
}
},
getGuiConfig: function (buzzword, callback) {
callback(guiConfig[buzzword]);
}
}
return self;
}]);
我的问题:
在我的组件的控制器中,我希望能够操纵我从服务的 getGuiConfig
函数返回的任何内容,比方说,我想删除属性的最后一个条目 FunctionIds
.这种操作不仅会影响我的控制器中的对象,还会操作我的服务中的 guiConfig
-Object。
function MyCtrl($scope, guiConfigService) {
var configData;
$scope.getNewGuiConfig = function() {
guiConfigService.getGuiConfig('Functions', function(data) {
configData = data;
// this does not only affect `configData`, but also the
// `guiConfig`-Object in guiConfigService:
configData.FunctionIds.splice(-1);
});
}
}
例如参见this JsFiddle。
我已经尝试过:
- 首先我想,问题是我调用了回调函数而不是直接 returning 对象,但我试过了,它似乎也不起作用。
- 通过
JSON.parse(JSON.stringify(guiConfig[buzzword]))
发送我的服务的guiConfig
对象的副本正在工作,但在我看来这不是正确的方法。
有没有一种好方法 return 来自服务对象的数据,而不引用实际对象?
All the services are singleton in angular.So you can make a copy of config data in your controller and modify it accordingly. According to me you should use constant service to store your app configurations and always make a copy of your configurations when you want to manipulate them using angular.copy().
function MyCtrl($scope, guiConfigService) {
var configData;
$scope.getNewGuiConfig = function() {
guiConfigService.getGuiConfig('Functions', function(data) {
configData = angular.copy(data);
configData.FunctionIds.splice(-1);
});
}
}