具有隔离范围的 AngularJs 服务

Question

在我的 Angular 应用程序中，我有一个服务，它存储一个配置结构，供我的应用程序的各个组件使用。在.run阶段，guiConfigService通过函数setGuiConfig从.json文件中读取配置，并能够通过函数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。

我已经尝试过的：

• 首先我想，问题是我调用了一个回调函数而不是直接返回对象，但我试过了，它似乎也不起作用。
• 通过JSON.parse(JSON.stringify(guiConfig[buzzword])) 发送我的服务的guiConfig 对象的副本是有效的，但在我看来这不是正确的做法。

有没有一种好方法可以从服务中的对象返回数据，而不引用实际对象？

Answer 1

所有的服务都是单例的。所以你可以在你的控制器中复制配置数据并相应地修改它。 根据我的说法，您应该使用常量服务来存储您的应用程序配置，并在您想使用 angular.copy() 操作它们时始终复制您的配置。

function MyCtrl($scope, guiConfigService) {
   var configData;
   $scope.getNewGuiConfig = function() {
      guiConfigService.getGuiConfig('Functions', function(data) {
       configData = angular.copy(data);
       configData.FunctionIds.splice(-1);
   });
 }
}