提交后，表单状态更改为$ invalid

Question

我不了解并做了很多研究但无济于事。点击提交按钮后，我的表单状态变回$ valid = false。这会导致输入控件变为RED。我该如何解决。这是我的代码。

<form class="form-horizontal" role="form" name="testMessageForm" novalidate>

    <div class="form-group"
         data-ng-class="{'has-error':testMessageForm.PhoneNumber.$invalid && testMessageForm.PhoneNumber.$dirty}">
        <label class="col-sm-3 control-label" for="Phone">Cell Number</label>
        <div class="col-sm-9">
            <input required
                   placeholder="nnn-nnn-nnnn"
                   ng-pattern="/^(\([0-9]{3}\) |[0-9]{3}-)[0-9]{3}-[0-9]{4}$/"
                   minlength="10"
                   maxlength="14"
                   data-ng-model="reminderTest.PhoneNumber"
                   id="PhoneNumber"
                   name="PhoneNumber"
                   class="form-control" />
            <span class="help-block has-error">
                <span ng-show="testMessageForm.PhoneNumber.$error.required">
                    required
                </span>
                <span ng-show="testMessageForm.PhoneNumber.$error.minlength">
                    At least 10 digits.
                </span>
                <span ng-show="testMessageForm.PhoneNumber.$error.maxlength">
                    Why so many characters. Double check.
                </span>
                <span ng-show="testMessageForm.PhoneNumber.$error.pattern">
                    Wrong Phone number pattern.
                </span>
            </span>
        </div>

    </div>


    <div class="form-group">
        <label class="col-sm-3 control-label" for="Email"></label>
        <div class="col-sm-9">
            <button class=" btn btn-success"
                    type="submit" value="Test"
                    data-ng-disabled="testMessageForm.$invalid"
                    data-ng-click="submitTestReminderForm()">
                Test Reminder Now
            </button>

        </div>
    </div>

    <div data-ng-show="loading == true">
        <div class="spinner">
            Loading...
        </div>
    </div>

    <div class="alert alert-success" data-ng-show="successMsg.length > 0">
        <a href="#" class="close" data-dismiss="alert">&times;</a>
        <strong>Great!   </strong> {{successMsg}}
    </div>

    <div class="alert alert-danger" data-ng-show="errorMsg.length > 0">
        <a href="#" class="close" data-dismiss="alert">&times;</a>
        <strong>oops!   </strong> {{errorMsg}}
    </div>
</form>

控制器代码。

$scope.submitTestReminderForm = function () {
    reminderService.insertTestReminder($scope.reminderTest).then(onReminderTestComplete, onReminderErrorTest);
};

服务代码

var insertTestReminder = function (reminderTest) {
    return $http.post("/api/ReminderTest", reminderTest);
};