AngularJS обновляет неправильные значения

#angularjs

#angularjs

Вопрос:

Я пытаюсь добавить переменную (кнопка отмены с функцией) в $scope.dialogs.activeSelect.buttons[3] , однако, как только я проверяю область, в которую она также добавила объект $scope.dialogs.manageprojects.buttons[3] . Это приводит к дублированию кнопки отмены при каждом вызове openSelectDialog. Нужно ли мне добавлять кнопку отмены при следующем обновлении области или я что-то упускаю?

 var app = angular.module('Application',[]);
app.controller('Main', function($scope, $http) {
    $scope.variables = {};
    $scope.functions = {};
    $scope.dialogs = {};

    $http.get("?action=inflate").then(function(response) {
        $scope.dialogs.manageprojects = {};
        $scope.dialogs.manageprojects.buttons = [];
        $scope.dialogs.manageprojects.buttons[0] = {};
        $scope.dialogs.manageprojects.buttons[0].name = "Open";
        $scope.dialogs.manageprojects.buttons[0].function = "";
        $scope.dialogs.manageprojects.buttons[1] = {};
        $scope.dialogs.manageprojects.buttons[1].name = "Rename";
        $scope.dialogs.manageprojects.buttons[1].function = "";
        $scope.dialogs.manageprojects.buttons[2] = {};
        $scope.dialogs.manageprojects.buttons[2].name = "Delete";
        $scope.dialogs.manageprojects.buttons[2].function = "";
        getData();
    });
    function getData() {
        $http.get("?action=get_file_structure").then(function(response) {
            $scope.dialogs.manageprojects.data = response.data;
        });
    }

    $scope.functions.openSelectDialog = function($Dialog) {
        $scope.dialogs.activeSelect = $Dialog;
        var cancelIndex = $Dialog.buttons.length;
        $scope.dialogs.activeSelect.buttons[cancelIndex] = {};
        $scope.dialogs.activeSelect.buttons[cancelIndex].name = "Cancel";
        $scope.dialogs.activeSelect.buttons[cancelIndex].function = function() {
            $scope.dialogs.activeSelect = {};
            console.log(getScope());
        };
        $scope.dialogs.activeSelect.show = true;
    };
});
  
 function getScope() {
    $scope = angular.element(document).find('main').scope();
    $return_scope = {};
    $return_scope.variables = $scope.variables;
    $return_scope.functions = $scope.functions;
    $return_scope.dialogs = $scope.dialogs;
    return $return_scope;
}
  

Комментарии:

1. какое значение имеет cancelIndex при выполнении нескольких вызовов?

2. Значение cancelIndex при использовании с $scope.dialogs.manageprojects всегда должно быть 3

Ответ №1:

Я пытаюсь добавить переменную (кнопка отмены с функцией) в $scope.dialogs.activeSelect.buttons[3] , однако, как только я проверяю область, она также добавляет объект в $scope.dialogs.manageprojects.buttons[3]

Вместо выполнения назначения ссылки используйте angular.copy:

 $scope.functions.openSelectDialog = function($Dialog) {
    ̶$̶s̶c̶o̶p̶e̶.̶d̶i̶a̶l̶o̶g̶s̶.̶a̶c̶t̶i̶v̶e̶S̶e̶l̶e̶c̶t̶ ̶=̶ ̶$̶D̶i̶a̶l̶o̶g̶;̶
    $scope.dialogs.activeSelect = angular.copy($Dialog);
    var cancelIndex = $Dialog.buttons.length;
    $scope.dialogs.activeSelect.buttons[cancelIndex] = {};
    $scope.dialogs.activeSelect.buttons[cancelIndex].name = "Cancel";
    $scope.dialogs.activeSelect.buttons[cancelIndex].function = function() {
        $scope.dialogs.activeSelect = {};
        console.log(getScope());
    };
    $scope.dialogs.activeSelect.show = true;
};
  

angular.copy Функция создает новый объект из исходного объекта. Изменения в новом объекте не повлияют на исходный объект.