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

我已经尝试过:

有没有一种好方法 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);
   });
 }
}