Angular UI Bootstrap模式。范围问题

Question

我是AngularJS的新手，我正在尝试使用“Draggables”创建一个List，您可以将其放入4个可排序的列表中。我让它与AngularUI-Sortable一起使用。

现在，对于下一部分，我正在尝试编辑内容（功能中的更多选项和设置）。使用AngularUI-Bootstrap的模态。

我这样做是为了打开我要编辑的所选项目中的内容。

正如你在Plunker中看到的那样，我差点搞定了。我唯一想通知的是，在我按下保存按钮后，{{ item }}为{{ widgetOption }}的方式。

http://embed.plnkr.co/TTNccRuToObZuSmwYlTG/preview

Answer 1

我的方法是在模态控制器中保留对原始对象的引用。因此，假设传入的对象是原始对象，并且只有在保存表单时才应修改它。对代码进行最少的更改以使其工作，我想出了这个plunker。

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

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


var ModalInstanceCtrl = function ($scope, $modalInstance, widgetOptionsLocal) {
    var widgetOptionsOriginal = widgetOptionsLocal;
    $scope.widgetOptions = angular.copy(widgetOptionsLocal);

    $scope.ok = function () {
      widgetOptionsOriginal.content = $scope.widgetOptions.content;
       $modalInstance.close($scope.widgetOptions);
    };

    $scope.cancel = function () {
       $modalInstance.dismiss('cancel');
    };
};