关于javascript：关闭模式不会清除textarea数据，但可以清除模型


Closing modal doesn't clear textarea data, but it does clear the model

我有一个包含文本区域的简单模式。我的问题是重置textarea的数据。

这是我的模态：

1
2
3
4
5
6
                <textarea ng-model="content" ng-change="statusChange(content)" placeholder="update" required="required"></textarea>
           
         
         
             
                 Cancel

我的控制器：

1
2
3
4
5
6
7
8
9
10
11
myApp.controller('MyCtrl', function($scope){
    $scope.content="";

    $scope.statusChange = function(param){
        $scope.content = param;
    }

    $scope.reset = function(){
        $scope.content ="";
    }
})

我的问题：我通过ng-model将文本区域中的数据绑定到内容，但是如果我在文本区域中输入内容，然后关闭模式，则得到$scope.content=""，但是，当我重新打开模式时，文本区域仍包含先前输入的数据。我可以通过打印出内容数据来确认文本区域中的数据与$scope.content。

的值不同

重新打开模式时，如何强制文本区域具有相同的$scope.content值？

这是问题的JSFiddle http://jsfiddle.net/RLQhh/64/。要查看此问题，请打开模式，在文本区域中键入一些内容，然后单击关闭按钮。注意控制台输出(它应该显示您键入的内容，然后是空字符串)。现在，重新打开模态，您将看到您键入的最后一个内容是文本区域中的内容。还要注意然后重新打开窗口，$scope.content中的当前数据显示在控制台中(它为空)。

相关讨论

您需要将content放入范围内的对象中。

我更新了小提琴，它起作用了。代替$scope.content，使用$scope.modal.content。有关更多信息，请参见此答案。可以在此处找到更详细的解释，但基本上与原语在javascript和范围共享中的工作方式有关。

ng-model是一个指令，它创建另一个作用域并将父作用域上的属性绑定(\\'= \\')到文本框的值(或textarea或select等)。当该属性是原始类型时，它将按值传递，并复制到内部范围。由于对象是通过引用传递的，因此在嵌套属性时这不是问题，因为传递了对对象的引用。

当您直接在reset方法中的作用域中写入内容时，它将替换(写入)控制器的$ scope值(而不是ng-model指令)，并且不同步。但是，如果将ng模型绑定到对象，则在写入内容(在本例中为modal.content)时，您正在读取模式并写入其content属性。该值将被替换，但是由于您的ng模型是绑定到模式而不是直接绑定到内容的，因此绑定不会中断(您只读取了模式，未写入模式)。

相关讨论