Is there a way to reset the $touched in Angular?

Question

I'm trying to implement a "Reset" button for my form. Some of my text fields use the $touched to determine if an error is displayed. But once the $touched flag is set, when I reset the model, $touched is not reset and so my error messages remain visible.

<div class="col-sm-4" ng-class="{'has-error' : donationForm.firstName.$invalid && donationForm.firstName.$touched}">
                <label for="firstName" class="control-label">First Name</label>
                <input type="text" id="firstName" name="firstName" class="form-control"
                       ng-model="editableDonation.person.firstName" ng-required="true" ng-maxlength="20" />
                <span class="help-block" ng-show="donationForm.firstName.$error.required && donationForm.firstName.$touched">
                    First Name is required.
                </span>
                <span class="help-block" ng-show="donationForm.firstName.$error.maxlength">
                    First Name is too long (20 max).
                </span>
            </div>

Is there a way to do that?

My resetForm:

$scope.resetForm = function () {
        $scope.donationForm.$setPristine();
        $scope.model = '';

        $scope.donation = donationService.defaultDonation;
        $scope.editableDonation = angular.copy($scope.donation);
    };

http://plnkr.co/edit/Oa91ZkTatsddSA4oujQK

Answer 1

DeborahK89 helped me by pointing out that I could use:

$scope.donationForm.$setUntouched();