窗體不清除$ .ajax成功函數中的值，使用angular

Question

我有一個表格，我正在使用angualr.js。 我將輸入值綁定到角度變量。 提交表單后，在$ .ajax的成功函數中，我為這些變量分配了空值，但是在表單中看到的是相同的值，而不是空字符串。 以下是我的表單代碼，

 <form name="addForm"  ng-submit="outClear()">
      <table>
       <tr>
          <td> <label>Title</label></td>
          <td> <input type="text" id="idTitle" ng-model="Title"/> </td>
        </tr>
        <tr>
           <td> <label>Description</label></td>
           <td> <textarea id="idDescription" name="desc" ng-model="Description" ></textarea> </td>
        </tr>
        <td><input type="submit" class="btn btn-default" value="Add" />  </td>
         <td></td>
         </tr>
        </table>
</form>

以下是我的Java腳本代碼，

var MyApp = angular.module("MyApp", []);
  MyApp.controller("TicketCntrl", function ($scope) {
 $scope.outClear = function () {
    var Title = $scope.Title;
    var Description = $scope.Description;

    var Ticket = {
        "Title": String(Title),
        "Description": String(Description),
    };

    $.ajax({
        type: "POST",
        url: "/Home/Add",
        data: Ticket,
        success: function (data, status) {
        alert('In success');
            $scope.clear();
        },
        error: function (status, error) {
        }
    });


};
$scope.clear = function () {
    $scope.Title = '';
    $scope.Description = '';
    alert('In clear');
  }
 }

它會轉到成功函數並顯示“ In Success”消息，然后將clear（）並為$ scope.Title和$ scope.Description分配''值，但是在文本框和文本區域中，我看到的值與我輸入的值相同。

我嘗試了另一件事，而不是outClear（），而是在提交后直接調用clear（）。 那就完美了（所有表單值都為空）。

請讓我知道我在哪里做錯了。

Answer 1

不要將Angular與jQuery混合使用來操縱范圍變量，它會弄亂angular的摘要循環。 如果您確實從jQuery更新scope變量，它將不會運行摘要循環。

您需要通過在Ajax中的方法clear()成功后在$scope調用$apply()來運行摘要循環，以快速解決此問題，但是理想情況下，我不希望采用這種方法。

而是使用$http代替$.ajax 。