AngularJS:混淆$ scope中的对象引用

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

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

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