Angular JS $作用域、数据绑定和变量变化

Angular JS $scope, databinding, and variables changing.

本文关键字：变量 变化 数据绑定 JS 作用域 Angular      更新时间：2023-09-26

所以我有一个应用程序，我在Angular JS v1.4.0上工作，我遇到了一个范围问题。有一个部分有一个需要提交的表单，但是在发送之前需要修改数据。我目前正试图在调用服务器之前在javascript中做到这一点。

有$scope。msgEditor，这是一个对象，它有一系列不同的值，这些值对于表单和消息变量本身都是必需的。重要的部分看起来像这样:

msgEditor [
    msg: {
        groups: {
            selected: {
                0: '1',
                1: '2',
            }
        }
    }
]

我正在尝试使用这个$scope变量，将其分配给一个局部变量，并开始像这样解析数据:

$scope.formOnSubmit = function () {
    formattedMessage = formatDataForSave($scope.msgEditor.msg);
};
function formatDataForSave(message) {
    message.groups = message.groups.selected.join(', ');
    return message;
}

我想要发生的是$scope.msgEditor。msg完全不改变，formattedMessage将从第二个函数返回，因此可以将其放入$http调用中。但是，连接会更改message、formattedMessage和$scope.msgEditor.msg

我做了更多的测试，看看发生了什么:

$scope.formOnSubmit = function () {
    $scope.test = $scope.msgEditor.msg;
    var formattedMessage = $scope.test;
    formattedMessage = formatDataForSave(formattedMessage);
};

并发现对formattedMessage所做的更改会改变$scope。$scope. msgedtio .msg.

任何关于为什么会发生这种情况，或者如何防止它的方向都将是惊人的。

我相信你对javascript中传入函数的参数感到困惑:在javascript中，所有参数都是通过引用传递的，所以结果就是你所经历的。看一下angular.copy函数

https://code.angularjs.org/1.3.17/docs/api/ng/function/angular.copy

我不能测试这个，但是你可以试试:

$scope.formOnSubmit = function () {
    var msgCopy = angular.copy($scope.msgEditor.msg);
    formattedMessage = formatDataForSave(msgCopy);
};
function formatDataForSave(message) {
    message.groups = message.groups.selected.join(', ');
    return message;
}
相关文章：