Javascript 为什么我需要在我的工厂使用angular.copy？

我试图让Thing factory发出HTTP请求，并能够在我的控制器中使用响应

在我的工厂里，我必须做

angular.copy（数据，arr）

。仅仅做

arr=data

是行不通的。为什么会这样

angular.copy（）

just a）删除

arr

中的所有内容，b）迭代

数据

并将内容分配给

arr

。这与

arr=data

之间的唯一区别在于

arr

指向

data

而不是

data

的新副本。这有什么关系？为什么

arr=data.slice（0）

不起作用（据我所知，它与

angular.copy）几乎相同）

实现目标的最佳方式是什么？（正确使用工厂）

main.html

<div class="container">

<div class="page-header">
  <h1>Test App</h1>
</div>

<ul>
  <li ng-repeat="thing in things">{{thing.name}}</li>
</ul>

</div>

---

这是因为您将

arr

设置为数组的某个新实例，而不是使用当前实例。这里有一个与你正在做的事情类似的例子：

var foo = function() {
    this.test = 'hello';
    console.log(this.test);
};

foo = function() {
    this.test = 'other';
    console.log(this.test);
};

console.log(foo()); // outputs other

angular.copy会执行以下操作：

// foreach item in the source (in this case data)
arr.push({
   my: "value"
});

---

您的问题与angular无关，而是与Javascript有关

var arr = [] // arr is a pointer to an empty array
var things = arr  // things is a pointer to the same empty array
arr = data   // now arr points to data, but things still points to the empty array

通过运行以下代码，您可以说服自己：

var a = [1];
var b = a;
a = [2];
// Now if you console.log a and b, a === [2] and b === [1]

但是，如果操纵对象的属性

var a = { data: 1 }
var b = a;
a.data = 2;
// Now a.data and b.data are the same: 2
a = { data: 3 };
// Here we changed a, not its property, so a and b are not the same anymore
// a.data === 3 but b.data === 2

如果您了解这一点，有很多方法可以解决您的问题，例如：

angular.module('testApp')
  .factory('Thing', function($http) {
  var obj = {};
  return {
    things: obj,
    get: function() {
      $http.get('/api/things').success(function(data) {
        obj.data = data;
      });
    }
  };
})

在HTML中使用

things.data

或者，如果不想使用对象属性，而是直接使用数组，而不是替换指针，则只需更新数组的内容（因此arr仍然指向同一数组）：

---

angular.copy适用于对象或数组，数据可能是对象吗？顺便说一句，您应该使用提升并将anon函数提取到命名函数中，只需将函数名传递给工厂和控制器方法。使计算模块的组件更加容易。

数据是一个对象数组。它之所以有效，是因为arr（数组）是一个引用，您需要保留引用才能使作用域绑定工作。否则，您只是用一个新的引用覆盖arr-这与最初绑定到范围的引用完全不同。@pixelbits您能详细说明一下吗？我认为范围绑定与$scope本身有关。工厂如何影响范围绑定？
angular.module('testApp')
  .factory('Thing', function($http) {
  var obj = {};
  return {
    things: obj,
    get: function() {
      $http.get('/api/things').success(function(data) {
        obj.data = data;
      });
    }
  };
})

angular.module('testApp')
  .factory('Thing', function($http) {
  var arr= [];
  return {
    things: arr,
    get: function() {
      $http.get('/api/things').success(function(data) {
        for (var i in data) {
          arr[i] = data[i];
        }
      });
    }
  };
})