带拼接的AngularJS / Javascript Bizzare行为

时间:2015-05-05 07:05:26

标签: javascript angularjs

我正在拼接手机类型列表。我有一个由$ scope.phoneTypeList定义的原始列表。在我的实际应用程序中,我通过AJAX获取列表,但我已将其定义为此示例的对象。

然后我有一个名为$ scope.addPhoneType的空列表。我将phoneTypelist中的数据分配到$ scope.addPhoneType,然后运行for循环。 for循环采用用户电话类型的数组。如果它在列表中,它将拼接addPhoneType。例如,如果用户有DEFAULT,它将从addPhoneType中删除它。

我遇到的问题是当我拼接addPhoneType时它也会拼接phoneTypeList。这就是示例phoneTypeList变为= [“DDI”,“MOBILE”,“FAX”],根本不应该触及它。

就像它绑定addPhoneType一样。我以前从未见过这个?这是正常的行为吗?有没有人有工作?在此先感谢,任何建议表示赞赏。

我的代码:

$scope.editCompany = function(){
      $scope.phone = [{phone_type_id:"DEFAULT",number:"1123"}]
      $scope.phoneTypeList = ["DDI", "DEFAULT", "MOBILE","FAX"];
      $scope.addPhoneType =[];
      $scope.addPhoneType = $scope.phoneTypeList;
      for (x=0;x<$scope.phone.length;x++){
         var phoneType = $scope.phone[x].phone_type_id;
         var index = $scope.addPhoneType.indexOf(phoneType);
         if (index >= 0){
         $scope.addPhoneType.splice(index,1);     
         }
      }
      console.log($scope.phoneTypeList);
   }

2 个答案:

答案 0 :(得分:1)

这个

$scope.addPhoneType = $scope.phoneTypeList

实际上会为新变量创建数组引用,而不只是将phoneTypeList数组的内容复制到addPhoneType。

如果要复制可以使用的内容:

var newArray = oldArray.slice();

(在您的情况下$ scope.addPhoneType = $ scope.phoneTypeList.slice();)

价:

答案 1 :(得分:1)

您看到的行为完全正常,因为非基元在javascript中“通过引用传递”。请查看此问题及其答案 - Setting one object equal to another object with the assignment operator in Javascript

要避免这种情况,您可以尝试使用angular.copyhttps://docs.angularjs.org/api/ng/function/angular.copy),这会将目标对象的深层副本创建为源,从而取消引用目标。

请参阅此链接以获取更多信息 - http://weblog.west-wind.com/posts/2013/Sep/16/JavaScript-Arrays-References-and-Databinding-in-Angular