0

我已经为多种用途创建了一个相当通用的对话框指令......但是当我使用它来编辑数据时......它仍然是双向绑定到原始调用控制器上的范围的。

这可能很简单,但我遇到了麻烦。我需要在对话期间克隆范围,然后在 okCallback 之前我需要将范围复制回来......所以用户实际上可以取消。

<div mydialog 
    open="{{isEditDialogOpen}}"
    modal="true"
    ok-button="Yes"
    ok-callback="saveEdits"
    cancel-button="No"
    cancel-callback="dismissEditDialog"
    title="Edit Category">
        <input ng-model="categoryToEdit.name" label-text="Category Name"></input>  
</div>

这个问题在这个小提琴中变得很明显。http://jsfiddle.net/hiddenkirby/HT6X7/

编辑类别,然后开始在框中输入内容。

有什么想法吗?我想保留指令的嵌入使用方面。

有没有更“角度”的方式来解决/解决这个问题?

4

2 回答 2

1

显示编辑表单时,将当前数据值复制到变量/属性中:

$scope.showEditDialog = function(category, index){
    $scope.index = index;
    $scope.origData = angular.copy(category);

如果用户点击取消/否,恢复它:

$scope.dismissEditDialog = function(){
    $scope.categories[$scope.index] = $scope.origData;

HTML 更改:

<a ng-click="showEditDialog(category, $index)">Edit</a>

小提琴

于 2013-02-28T17:50:14.423 回答
0

所以我用下面的小提琴结束了。http://jsfiddle.net/hiddenkirby/FYCXk/

我关闭了嵌入以使用隔离范围。然后我对参数化模型值(如果存在)进行angular.copy .. 但我从

scope.$parent["nameOfObjectOnParent"]

复制它可以让我在我的编辑对话框中有一个取消状态。正在编辑的模型的这个隔离副本的另一个好处是,它通过 validationCallback 为我提供了$ watch东西。

我将能够选择在对话框上放置一个带有绑定的完整表单,并使用一些验证规则将一个对象传递给它。

于 2013-03-06T21:16:56.450 回答