無法從控制器重置Angular Material設計表單

Question

我有一個Angular Material設計表單，有3個輸入字段， required選項。 單擊提交按鈕后，我無法將表單重置為默認狀態。 我使用$setPristine將表單更改為原始狀態，但紅色錯誤行在提交后出現。 提交表單后有沒有辦法擺脫這些錯誤。

謝謝。

Codepen鏈接： http ：//codepen.io/sateesh2499/pen/pbkjVV

視圖：

<div ng-controller="AppCtrl" layout="column" ng-cloak="" class="inputdemoErrors" ng-app="MyApp">

  <form name="careersForm">
        <div class="careersContainer">
            <md-content>
                <div layout-gt-sm="row">
                    <md-input-container class="md-block" flex-gt-sm>
                        <label>Job Title</label>
                        <input type="text" name="jobTitle" ng-model="careers.jobTitle" required>
                    </md-input-container>
                    <md-input-container class="md-block" flex-gt-sm>
                        <label>Job Location</label>
                        <input type="text" name="jobLocation" ng-model="careers.jobLocation" required>
                    </md-input-container>
                    <md-input-container class="md-block" flex-gt-sm>
                        <label>Job Category</label>
                        <input type="text" name="jobCategory" ng-model="careers.jobCategory" required>
                    </md-input-container>
                </div>

            </md-content>
        </div>
        <div class="row text-center">
            <div class="col-sm-12">
                <md-button class="md-raised" style="width: 200px"
                           ng-click="postJob()">Submit</md-button>

            </div>
        </div>
    </form>
Pristine: {{careersForm.$pristine}}
</div>

控制器：

angular.module('MyApp',['ngMaterial', 'ngMessages', 'material.svgAssetsCache'])

.controller('AppCtrl', function($scope) {
  $scope.careers = {};
  $scope.postJob = function(){
    // after successful posting
    $scope.careers = {};
    $scope.careersForm.$setPristine();
  }
});

Answer 1

你可以通過添加$scope.careersForm.$setUntouched();來解決它$scope.careersForm.$setUntouched(); 在調用$setPristine 。

我已經分叉你的那個，你可以看到它的工作。 這里的人物

$scope.postJob = function(){
    // after successful posting
    $scope.careers = {};
    $scope.careersForm.$setPristine();
    $scope.careersForm.$setUntouched();
  }

無論如何，我認為你的代碼應該工作......所以可能是一個bug。

希望能幫助到你