刷新最初传入AngularJS中的modalInstrance的数据

Question

使用Angular - UI Bootstrap

我将数据传递到modalInstance，如下所示。在模态中，用户可以创建新项目。在保存按钮按下，新项目将发送到服务器。我需要能够使用$ scope.items中的更新数据刷新模态实例。注意，模态不会在保存时关闭，所以我不能只重新打开它。任何帮助将不胜感激。

$scope.items = ['item1', 'item2', 'item3'];

$scope.open = function (size) {

var modalInstance = $modal.open({
    templateUrl: 'myModalContent.html',
    controller: 'ModalInstanceCtrl',
    resolve: {
        items: function () {
            return $scope.items;
        }
    }
});

modalInstance.result.then(function () {
    // post updated $scope.items to server
    // get fresh $scope.items from server
    // notify modal of the updated items
}, function () {

});
};
});

Answer 1

您可以尝试仅为$modalInstance作为当前$scope的孩子创建范围，如下所示：

var modalInstance = $modal.open({
    templateUrl: 'myModalContent.html',
    controller: 'ModalInstanceCtrl',
    scope: $scope
});

所以现在在向item添加一些items后，一切都会正常工作。

有关详细信息，您可以在 angular bootstrap page 上查看$modal指令的说明：

scope - a scope instance to be used for the modal's content (actually the $modal service is going to create a child scope of a provided scope). Defaults to $rootScope

演示：http://plnkr.co/edit/khzNQ0?p=preview

希望，它会解决你的问题;）