1

我正在尝试使用模式窗口(请参阅http://angular-ui.github.io/bootstrap/)。

在父控制器中,我具有以下功能:

    $scope.open = function () {

        var modalInstance = $modal.open({
            templateUrl: 'myModalContent.html',            
            controller: ModalInstanceCtrl,
            resolve: {
            year: function () {
                return $scope.year.value;
            },
            month: function () {
                return $scope.month;
            },
            day: function () {
                return $scope.day.name;
            },
            todos: function () {
                return $scope.day.toDoItems;
            }
        },
        backdrop: 'static'
    });

    modalInstance.result.then(function (todos) {
        angular.forEach(todos, function (todo) {
            if (todo.New)
                $scope.day.toDoItems.push(todo);
        });            
    }, function () {
        $log.info('Modal dismissed at: ' + new Date());
    });
};

在模态控制器中有一个 addTodo 函数:

var ModalInstanceCtrl = function ($scope, $modalInstance, year, month, day, todos) {
...
    $scope.todos = todos; 
    $scope.addTodo = function () {
        $scope.todos.push({ TodoText: $scope.todoText.value, Done: false, Del: false, Date: new Date(year, month, day), Priority: 1, New: true});
        $scope.todoText.value = "";
    };
...
$scope.ok = function () {
    $modalInstance.close($scope.todos);
    };
};

在父视图中,显示了todos每天的日历。单击一天的标题时,模式窗口将打开,您可以添加待办事项。我的问题是,在模式窗口中添加待办事项时,也会同时todos添加到父视图中。现在todos它们在父视图中添加了两次:一次是在模态视图中添加,一次是我在模态视图上单击确定。但我希望todos仅在模态视图上单击“确定”时才将项目添加到父视图。

有没有人解决这个问题?提前致谢!

您可以在 Plunker 中看到它是如何工作的:http ://plnkr.co/edit/Nr1h7K3WZyWlRlrwzhM3?p=info

4

1 回答 1

2

在模态控制器的解析对象中,您实际上将父级的范围 todos 对象作为引用传递回来,因此当您在模态控制器中分配它时,$scope.todos = todos;它实际上指向父级的todos范围变量。您可以返回父级待办事项的副本,而不是对变量的引用。

todos: function () {
    return angular.copy($scope.day.toDoItems);
}

http://plnkr.co/edit/Ty10C8JOKHlwb2bWA89r?p=info

于 2013-10-04T14:04:57.500 回答