Question

我在从控制器获取服务中的值时遇到问题。我的服务如下：

angular.module('someApp').factory('someSvc', SomeSvc);

function SomeSvc($http) {
    var colors = [];
    function loadColors() {
        return $http.get('SomeApi/GetColors')
            .then(function (result) {
                //colors = result.data.colors;//<-this doesn't work
                //angular.copy(result.data.colors, colors);//<-this works
            });
    }
    return {
        loadColors: loadColors,
        colors: colors
    };
}

然后我的控制器可能会这样打电话：

someSvc.loadColors().then(function(){vm.colors = someSvc.colors;});

因此，当我调试时，如果我在控制器中设置了一个断点，在该控制器中进行了对vm.colors的赋值，那么在someService对象上公开的colors属性只有一个空数组或任何具有预期值的数组，具体取决于哪个我在服务中使用的两条注释掉的行。

如果我在服务中设置一个断点来进行颜色分配，那么变量颜色总是具有预期值（例如，让我们说[＆＃34;红色＆＃34;，＆＃34;黄色＆＃34;，＆＃34;绿色＆＃34;]是来自http调用的内容）。所以我可以看到控制器触发http调用，观察值返回并分配给服务中的颜色，但是控制器只看到一个空数组，除非我做了angular.copy调用。

另外，有趣的是，如果我将服务的return语句更改为：

return {
    loadColors: loadColors,
    colors: function() {return colors;}
};

然后在控制器中说vm.colors = someSvc.colors();然后也可以正常工作。

这是为什么？为什么这个数组没有通过？

更新：我发现代替angular.copy（）行，我可以选择这样做，一切都按预期工作：

for (var i = 0; i < result.data.colors.length; i++) {
    colors[i] = result.data.colors[i];
}

似乎ASSIGNING对象是一个问题，而修改它是好的吗？那是为什么？

Answer 1

这可能适用于你。猜猜它只是一个指针问题？

angular.module('someApp')

.factory('someSvc', function($http)
{
  return {
    colors: [],
    loadColors: function()
    {
      var self = this;

      return $http.get('SomeApi/GetColors').then(function (result) 
      {
        self.colors = result.data.colors;
      });
    }
  };
});

Answer 2

当您在工厂中调用return时，someSvc.colors只是空数组 - 并返回值。由于Angular提供程序通常只尝试运行一次，因此将来它实际上不会再次检查someSvc.colors - 只返回初始值。

将它包装在函数中意味着它每次都运行该函数，因此它会获取更新后的值。

角度服务未按预期暴露价值

2 个答案: