AngularJS：在$范围混淆有关对象引用

Question

这里是我的代码：

<div ng-controller="TestController"> 
    <h1 ng-click="click()">{{person.name}}</h1> 
</div> 
<script type="text/javascript"> 
    var app = angular.module('app', []); 
    app.controller('TestController', function ($scope) { 
     var p = $scope.person = { 
      name: 'Br' 
     }; 

     $scope.click = function() { 
      p = {}; 
     } 
    }); 
</script> 

当我点击<h1>，我重置p对象，所以我期望在h1标签空。

因为我认为变量p与$scope.person具有相同的引用，它指向相同的对象。

实际上没有改变，当我点击，只有当我重置$scope.person = {}。

那么为什么它不像我所期望的那样工作？我的想法出了什么问题？

Answer 1

这与Angular无关，但是如何在JavaScript中操作对象。

当你说p和$scope.person都引用内存中的同一对象时，你是对的。

但是当你写p = {}你不动它p指着，您有p引用一个新对象，该对象因此不$scope.person了。

var a = {}; 
var b = a; 
a === b; // true 
b = {}; 
a === b; // false 

如果你想删除的p/$scope.person的name属性，你可以写

delete p.name; // this will also delete $scope.person.name