Question

在angularJs中保存记录后，表单不会被清除。我试图通过多种方式重置表单，但表单不会重置。我的angularjs版本是1.4.8。这个问题也是重复的，但我尝试了堆栈溢出用户所说的。这对我没有用。

寻找肯定回复

谢谢。

Html代码：

<form name="myForm" id="myForm" novalidate>

    <input type="hidden" name="forumValue" ng-model="fid.forumValue"
    id="forumValue" placeholder="fourm Id" />

    <div class="form-group row">
    <label for="inputAnswer" class="col-sm-2 col-form-label">Answer</label>
    <div class="col-sm-10">
    <textarea rows="10" name="answer" class="form-control"
    ng-model="fid.answer" required></textarea>

    </div>
    </div>

    <div class="form-group row">
    <div class="col-sm-2"></div>
    <div class="col-sm-8">
    <button type="button" class="btn btn-success"
    ng-click="saveUserAnswer(fid)">Post Your Answer</button>
    </div>
    </div>
    </form>

控制器代码：

$scope.saveUserAnswer = function(fid) {
UserRepository.saveUserAnswer(fid).then(
function(response) {
var status = response.message;
if (status == "success") {
    alert("posted success");
    $scope.UserAnswer=getUserOnIdAnswer(fid.UserValue);
    $scope.myForm.$setPristine();
    $scope.myForm.$setUntouched();
    $state.go('UserAnswer');

}
else {
    $scope.User=response;
    alert("posted Fail,Please correct the details..!!");
    }
});

};

Answer 1

您的表单是否包含在ng-if声明中？如果是这样，表单可能在子范围内，您可以尝试：

选项A 将ng-if替换为ng-hide。

选项B 将表单绑定到父作用域上的现有对象：

$scope.myData = {};
$scope.saveUserAnswer = function(fid) {
  ...
};

然后在HTML中，参考父作用域上的表单：

<form name="myData.myForm" id="myForm" novalidate>
</form>

来源：https://github.com/angular/angular.js/issues/15615

Answer 2

我试图重新创建您的问题，但没有调用UserRepository只是为了确认我们可以将$ pristine值设置为true并重置表单。

  <form name="form.myForm" id="myForm" novalidate>
                     <input type="hidden" name="forumValue" ng-model="fid.forumValue" id="forumValue" placeholder="fourm Id" />

                  <div class="form-grou`enter code here`p row">
                    <label for="inputAnswer" class="col-sm-2 col-form-label">Answer</label>
                    <div class="col-sm-10">
                      <textarea rows="10" name="form.myForm.answer" class="form-control" ng-model="fid.answer" required></textarea>
                    </div>
                  </div>

                  <div class="form-group row">
                    <div class="col-sm-2"></div>
                    <div class="col-sm-8">
                      <button type="button" class="btn btn-success" ng-click="saveUserAnswer(fid)">Post Your Answer</button>
                    </div>
                  </div>
   </form>
                <pre>{{form.myForm.$pristine}}</pre>

和控制器代码如下：

      $scope.form = {};
      $scope.saveUserAnswer = function(fid) {
        $scope.form.myForm.$setPristine();
        $scope.fid = {};
//omitted the user repository code
      };

以上内容会将表单的原始值设置为true，并在点击按钮时重置fid的值。

修改

对存储库功能的调用也应采用以下格式：

UserRepository.saveUserAnswer(fid).then( function(response){ //success }, function(response){ //error } );

Answer 3

在控制器中尝试添加＆＃39; $ scope.fid.answer = null;＆＃39;在scope.myForm。$ setPristine（）;

之后像这样。

$scope.saveUserAnswer = function(fid) {
    UserRepository.saveUserAnswer(fid).then(
    function(response) {
    var status = response.message;
    if (status == "success") {
    alert("posted success");
    $scope.UserAnswer=getUserOnIdAnswer(fid.UserValue);
    $scope.myForm.$setPristine();
    $scope.myForm.$setUntouched();
    $scope.fid.answer=null;
    $state.go('UserAnswer');

}
else {
    $scope.User=response;
    alert("posted Fail,Please correct the details..!!");
    }
});

};

Angular - $ scope.myForm。$ setPristine（）未定义

3 个答案: