Angularjs 在angular JS中与自定义模态对话框一起使用时，如何将窗体设置为prisitne状态

我使用下面的指令在JS中显示一个特定的表单（比如注册表单）

.directive('modalDialog', function () {
return {
    restrict: 'E',
    scope: {
        show: '='
    },
    replace: true, // Replace with the template below
    transclude: true, // we want to insert custom content inside the directive
    link: function (scope, element, attrs) {
        scope.dialogStyle = {};
        if (attrs.width)
            scope.dialogStyle.width = attrs.width;
        if (attrs.height)
            scope.dialogStyle.height = attrs.height;
        scope.hideModal = function () {
            scope.show = false;
        };
    },
    template: '<div class="ng-modal" ng-show="show">' +
              '<div class="ng-modal-overlay"></div>' +
              '<div class="ng-modal-dialog" ng-style="dialogStyle">' +
              '<div class="ng-modal-close" ng-click="hideModal()">X</div>' +
              '<div class="ng-modal-dialog-content" ng-transclude></div>' +
              '</div>' +
              '</div>'
  };
});

}]))

成功注册后，我希望清除表单的内容，并且如果用户出于某种原因关闭并重新打开模式对话框，则仍会显示以前的值。有人能帮我在成功注册或隐藏后等特定事件中清除表格的内容吗

我在

ng submit

中尝试了

regForm.$setPristine（）

，但它在单击submit按钮后立即关闭模式对话框，因此用户将无法看到当前操作的状态。任何提示都会对我大有帮助

---

提前谢谢。

您能出示表格并提交代码吗？我已经更新了我的查询，请看一下

<form class="elegant-aero" role="form"
  ng-controller="RegisterController"
  ng-submit="regForm.$valid && registerUser()"
  name="registrationForm"
  novalidate>
<div style="margin: 0 auto">
    <div class="Table">
        <div class="Title">
            <p>User Register</p>
        </div>
        <div class="Row">
            <div class="Cell">
                <label for="txtid">ID</label>
            </div>
            <div class="Cell">
                <input type="text" class="form-control" id="txtid" name="txtid"
                       ng-model="id" ng-model-options="{ updateOn: 'blur' }"
                       ng-minlength="9" ng-maxlength="9" required valid-id>
            </div>
            <div ng-messages="registrationForm.txtid.$error"
                 ng-if="registrationForm.txtid.$invalid && !registrationForm.txtid.$pristine">
                <div ng-message="required">ID is required</div>
                <div ng-message="minlength">ID must have 9 characters</div>
                <div ng-message="maxlength">ID must have 9 characters</div>
                <div ng-message="validid">ID must start with E or G</div>
            </div>
        </div>
        <div class="Row">
            <div class="Cell">
                <label for="txtPassword">Password</label>
            </div>
            <div class="Cell">
                <input type="password" class="form-control" id="txtPassword" name="txtPassword"
                       ng-model="Password" ng-model-options="{ updateOn: 'blur' }"
                       ng-minlength="6" ng-maxlength="12" required>
            </div>
            <div ng-messages="registrationForm.txtPassword.$error" ng-if="registrationForm.txtPassword.$invalid && registrationForm.txtPassword.$dirty">
                <div ng-message="required">Password is required</div>
                <div ng-message="minlength">Password must have atleast 6 characters</div>
                <div ng-message="maxlength">Password must have atleast 12 characters</div>
            </div>
        </div>
        <div class="Row">
            <div class="Cell">
                <label for="txtConfirmPassword">Confirm Password</label>
            </div>
            <div class="Cell">
                <input type="password" class="form-control" id="txtConfirmPassword" name="txtConfirmPassword"
                       ng-model="ConfirmPassword" ng-model-options="{ updateOn: 'blur' }"
                       required compare-to="Password">
            </div>
            <div ng-messages="registrationForm.txtConfirmPassword.$error" ng-if="registrationForm.txtConfirmPassword.$invalid && registrationForm.txtConfirmPassword.$dirty">
                <div ng-message="required">Confirm Password field is required</div>
                <div ng-message="compareTo">Password and Confirm Password fields do not match</div>
            </div>
        </div>
        <div class="Row">
            <div class="Cell">
                <label for="txtFirstName">First Name</label>
            </div>
            <div class="Cell">
                <input type="text" class="form-control" id="txtFirstName" name="txtFirstName"
                       ng-model="FirstName" ng-model-options="{ updateOn: 'blur' }"
                       required>
            </div>
            <div ng-messages="registrationForm.txtFirstName.$error" ng-if="registrationForm.txtFirstName.$invalid && registrationForm.txtFirstName.$dirty">
                <div ng-message="required">First name is required</div>
            </div>
        </div>
        <div class="Row">
            <div class="Cell">
                <label for="txtLastName">Last Name</label>
            </div>
            <div class="Cell">
                <input type="text" class="form-control" id="txtLastName" name="txtLastName"
                       ng-model="LastName" ng-model-options="{ updateOn: 'blur' }"
                       required>
            </div>
            <div ng-messages="registrationForm.txtLastName.$error" ng-if="registrationForm.txtLastName.$invalid && registrationForm.txtLastName.$dirty">
                <div ng-message="required">Last name is required</div>
            </div>
        </div>
        <div class="Row">
            <div class="Cell">
                <label for="txtPhone">Contact Number</label>
            </div>
            <div class="Cell">
                <input type="text" class="form-control" id="txtPhone" name="txtPhone"
                       ng-model="Phone" ng-model-options="{ updateOn: 'blur' }"
                       ng-pattern="/^\(?(\d{3})\)?[ .-]?(\d{3})[ .-]?(\d{4})$/" required>
            </div>
            <div ng-messages="registrationForm.txtPhone.$error" ng-if="registrationForm.txtPhone.$invalid && registrationForm.txtPhone.$dirty">
                <div ng-message="required">Contact number is required</div>
                <div ng-message="pattern">Must be a valid 10 digit phone number</div>
            </div>
        </div>
    </div>
    <div style="width: 60%; margin: 0 auto;">
        <input style="margin-left: 70px;" type="submit" class="btn btn-success" id="submit" value="Sign Up" />
    </div>
    <div ng-show="ErrorMessage" data-ng-bind-html="ErrorMessage">

    </div>
</div>

.controller('RegisterController', ['$scope', '$http', '$log', 'authService', '$sce', 
function ($scope, $http, $log, authService, $sce) {

    var OnRegistrationSuccess = function (data) {
        alert("Calling API");
        if (data.status == 201) {
            $scope.ErrorMessage = $sce.trustAsHtml("Registration successfull, please continue to log in");
        }
        else {
            $scope.ErrorMessage = $sce.trustAsHtml("Registration failed");
        }
    };

    var OnRegistrationFailure = function (response) {
        var errorsString = "";
        if (response != null) {
            for (var key in response.data.modelState) {
                if (response.data.modelState.hasOwnProperty(key)) {
                    for (var i = 0; i < response.data.modelState[key].length; i++) {
                        errorsString = (errorsString == "" ? "" : errorsString + "<br/>") + response.data.modelState[key][i];
                    }
                }
            }
            $scope.ErrorMessage = $sce.trustAsHtml(errorsString);
        }
        else {
            $scope.ErrorMessage = $sce.trustAsHtml("Registration failed");
        }
    };

    $scope.registerUser = function (registrationForm) {

        $scope.ErrorMessage = "";

        var userToRegister = {
            Id: $scope.id,
            Phone: $scope.Phone,
            Password: $scope.Password,
            FirstName: $scope.FirstName,
            LastName: $scope.LastName
        };

        authService.saveRegistration(userToRegister)
        .then(OnRegistrationSuccess, OnRegistrationFailure);
    };

.factory('authService', ['$http', '$q', 'localStorageService', '$log', function ($http, $q, localStorageService, $log) {

var serviceBase = "http://localhost:8080/";
var authServiceFactory = {};

var _authentication = {
    isAuth: false,
    userName: ""
};

var _saveRegistration = function (userToRegister) {
    _logOut();

    return $http.post(serviceBase + 'api/registration/register', userToRegister,
                JSON.stringify(userToRegister),
                {
                    headers: {
                        'Content-Type': 'application/x-www-form-urlencoded'
                    }
                }
               );
};

authServiceFactory.saveRegistration = _saveRegistration;

return authServiceFactory;