關閉模式不清除textarea數據，但它確實清除模型

Question

我有一個簡單的模態，其中包含一個文本區域。我的問題是重置textarea的數據。

這裏是我的模式：

<div class="modal fade" ng-controller="MyCtrl"> 
    <div class="modal-dialog"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      </div> 
      <div class="modal-body"> 
       <textarea ng-model="content" ng-change="statusChange(content)" placeholder="update" required="required"></textarea> 
      </div> 
     </div> 
     <div class="modal-footer"> 
      <a class="btn" data-dismiss="modal" aria-hidden="true" ng-click="reset()"> 
       Cancel 
      </a> 
     </div> 
    </div> 
</div> 

我的控制器：

myApp.controller('MyCtrl', function($scope){ 
    $scope.content=""; 

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

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

我的問題：我有必然通過NG-模型內容textarea的數據，但如果我內容輸入到我的文本區域，然後關閉模式，我們得到$scope.content=""，但是，當我重新打開模式時，textarea仍然包含以前輸入的數據。我可以通過打印出內容的數據來確認，文本區域中的數據與$scope.content的值不同。

當模式重新打開時，如何強制文本區域具有相同的值$scope.content？

這是一個JSFiddle的問題http://jsfiddle.net/RLQhh/64/。要查看問題，請打開模式，在textarea中鍵入內容，然後單擊關閉按鈕。注意控制檯的輸出（它應該顯示你輸入的內容，後面跟着空字符串）。現在重新打開模式，你會看到你輸入的最後一件東西是在textarea中。另請注意，然後重新打開窗口，控制檯中將顯示$scope.content中的當前數據（它爲空）。

Answer 1

您需要將content放入範圍內的對象中。

我更新了fiddle，它工作。而不是$scope.content使用$scope.modal.content。有關更多信息，請參閱this answer。可以找到更詳細的解釋here，但它基本上與原語在JavaScript和範圍共享中的工作方式有關。

ng-model是一個指令，它創建另一個作用域並將（'='）父作用域的屬性綁定到文本框（或textarea或select等）的值。當該屬性是一個原始類型時，它會被值傳遞並被複制到內部作用域。由於對象通過引用傳遞，當屬性被嵌套時，這不是問題，因爲對該對象的引用被傳遞。

當您直接向您的內容編寫代碼時，您將重置方法的範圍，它替換（寫入）控制器$ scope的值，而不是ng-model指令，並且不同步。但是，如果您將ng-model綁定到對象，當您寫入內容（在本例中爲modal.content）時，您正在讀取模態並寫入其內容屬性。該值被取代，但由於你的ng模型直接綁定到模態而不是內容，所以綁定不會被破壞（你只能讀取模態，不會寫入它）。