$ setPristine() не работает.

**** Примечание. Я вырезал некоторые из моих других функций, чтобы код мог считываться быстрее. Я не могу очистить форму. когда я нажимаю кнопку с функцией отмены. Я думал, что могу установить форму по умолчанию, но это не имеет никакого значения.

<form  name="myForm" novalidate ng-submit="submit()"> 
    <table class="mealCost"> 

        <!-- descriptions -->
        <tr> 
            <td> Base Meal Price: </td>
            <td><input type="number" name="price" ng-model="mealPrice" required></td>
        </tr>
        <!-- waiter puts in the info -->
        <tr> 
            <td> Tax Rate: % </td>
            <td><input type="number" step="0.01" name="tax" ng-model="mealTax" required></td>

        </tr>

        <tr> 
            <td> Tip Percentage: % </td>
            <td><input type="number"  name="tip" step="0.01" ng-model="tipPercent" required></td>

        </tr>

    </table>

    <p class="userResponse"> 
    <input type="submit" value="Submit"> 
    <!-- <input id="cancel" type="submit" value="Cancel" ng-submit="cancel(original)"> -->
    <button ng-click="cancel()">Start Over</button>
    </p>

</form>

Вот мой javascript. Я пытаюсь установить свою форму в $setPristine, используя команду button wiht ng-click. Я, хотя эта настройка формы по умолчанию поможет, но ничего не происходит при отправке

var app = angular.module('myApp',[]).
    controller('costController', function($scope) {
        // $scope.ready= false;
        $scope.mealPrice ="" ;
        $scope.mealTax = 0.05;
        $scope.tipPercent =0.05; 
        //  possibly could do 

        var defaultForm={
            price: "",
            tax: "",
            tip:""
        }

$scope.cancel = function() {
            $scope.myForm.$setPristine();
            $scope.user = angular.copy(defaultForm);
            console.log('empty');
        }

Ответы

Ответ 1

Я думаю, вы ошибаетесь.

$setPristine:

"Этот метод можно вызвать для удаления класса 'ng-dirty' и установить форму в свое первозданное состояние (класс ng-pristine). Этот метод также будет распространяться на все элементы управления, содержащиеся в этой форме."

Таким образом, это очищает классы, но не переменные $scope. Вы делаете reset переменную $scope.user, можете сказать:

Добавить пользователя. перед каждой моделью в Html

ng-model="user.tipPercent"
ng-model="user.mealTax"
ng-model="user.mealPrice"

И замените это в своем JS:

// $scope.ready= false;
$scope.mealPrice ="" ;
$scope.mealTax = 0.05;
$scope.tipPercent =0.05; 
//  possibly could do 

var defaultForm={
    price: "",
    tax: "",
    tip:""
}

$scope.cancel = function() {
    $scope.myForm.$setPristine();
    $scope.user = angular.copy(defaultForm);
    console.log('empty');
}

:

var defaultForm = {
    mealPrice : "",
    mealTax : 0.05,
    tipPercent : 0.05
}

$scope.user = angular.copy(defaultForm);

$scope.cancel = function () {
    $scope.myForm.$setPristine();
    $scope.user = angular.copy(defaultForm);
    console.log('empty');
}

Ответ 2

$scope.master = {};

$scope.reset = function(form) {

      if (form) {
          form.$setPristine();
           $scope.user = angular.copy($scope.master);
         form.$setUntouched();
      }

Ответ 3

Это будет работать, если ng-model привязаны к $scope.user.price, $scope.user.tax и $scope.user.tip. Однако они связаны с $scope.price, $scope.tax и $scope.tip.

Установка формы $pristine означает только значения, не измененные пользователем. Это фактически не изменяет значения.

Решение A:

Привяжите модели к user.* и замените

$scope.mealPrice = '';
$scope.mealTax = 0.05;
$scope.tipPercent = 0.05;

с

$scope.user = {
    mealPrice: '',
    mealTax: 0.05,
    tipPercent: 0.05
};

Решение B:

Заменить:

$scope.user = angular.copy(defaultForm);

с

$scope.mealPrice = defaultFrom.mealPrice;
$scope.mealTax = defaultFrom.mealTax;
$scope.tipPercent = defaultFrom.tipPercent;