javascript - Angular 1.2.1 中的 $setPristine() 方法似乎没有按预期工作

Question

我尝试使用 AngularJS 中的 $setPristine 函数重置文本框，但它似乎没有产生预期的行为。

我的表单如下所示:

<form name="addInviteForm" ng-controller="InviteCtrl" ng-submit="sendInvitation(userEmail)">

      Pristine? {{addInviteForm.$pristine}}

      <!-- email input -->
      <div>
        <input type="email" name="email" ng-model="userEmail" placeholder="Enter email here"  class="line-item-input see" required>
        <span class="error" ng-show="addInviteForm.email.$error.email" style="color:red">Invalid Email</span>
      </div>

      <!-- submit button -->
      <input type="submit" name="send" class="btn btn-success center" value="Send Invitation">
</form>

以及我的 Controller 中相应的代码:

$scope.sendInvitation = function(userEmail) {

        // do some work here ...

        // hmm, this doesn't seem to work ...
        $scope.addInviteForm.$setPristine();
    };

虽然表单显示 $pristine 在表单输入时设置为 true，然后在文本中输入数据时设置为 false -框，在提交表单后确实显示 $pristine 设置为 true ....但文本框中的值仍然保持按下提交按钮之前的值。

我在这里错过了什么？

Answer 1

$setPristine 不会清除表单中控件的值:

来自 the docs :

Sets the form to its pristine state.

This method can be called to remove the 'ng-dirty' class and set the form to its pristine state (ng-pristine class). This method will also propagate to all the controls contained in this form.

Setting a form back to a pristine state is often useful when we want to 'reuse' a form after saving or resetting it.

从上面的描述中可以看出，$setPristine 仅更改表单的状态(从而重置应用于表单中每个控件的 css)。

如果你想清除每个控件的值，那么你需要在代码中为每个做。

This plunker显示 $setPristine 的运行情况。