回避策のないソリューション
回避策なしでAngularJSを使用するソリューションを思いつきました。ここでの秘訣は、AngularJS機能を使用して、同じ名前の複数のディレクティブを持つことです。
他の人が述べたように、実際にはプルリクエスト（https://github.com/angular/angular.js/pull/1127）があり、フォームをリセットできるAngularJS1.1.xブランチになりました。このプルリクエストへのコミットにより、ngModelおよびform / ngFormディレクティブが変更されます（リンクを追加したかったのですが、Stackoverflowでは3つ以上のリンクを追加したくありません）。
これで、独自のngModelおよびform / ngFormディレクティブを定義し、プルリクエストで提供される機能でそれらを拡張できます。
これらのディレクティブをresettableFormという名前のAngularJSモジュールにラップしました。このモジュールをプロジェクトに含めるだけで、AngularJSバージョン1.0.xは、この点でAngular1.1.xバージョンであるかのように動作します。
「1.1.xに更新したら、コードを更新する必要はありません。モジュールを削除するだけで完了です！」
このモジュールは、フォームリセット機能のために1.1.xブランチに追加されたすべてのテストにも合格します。
私が作成したjsFiddle（http://jsfiddle.net/jupiter/7jwZR/1/）の例でモジュールが機能しているのを見ることができます。
ステップ1：プロジェクトにresettableformモジュールを含める
(function(angular) {
// Copied from AngluarJS
function indexOf(array, obj) {
if (array.indexOf) return array.indexOf(obj);
for ( var i = 0; i < array.length; i++) {
if (obj === array[i]) return i;
}
return -1;
}
// Copied from AngularJS
function arrayRemove(array, value) {
var index = indexOf(array, value);
if (index >=0)
array.splice(index, 1);
return value;
}
// Copied from AngularJS
var PRISTINE_CLASS = 'ng-pristine';
var DIRTY_CLASS = 'ng-dirty';
var formDirectiveFactory = function(isNgForm) {
return function() {
var formDirective = {
restrict: 'E',
require: ['form'],
compile: function() {
return {
pre: function(scope, element, attrs, ctrls) {
var form = ctrls[0];
var $addControl = form.$addControl;
var $removeControl = form.$removeControl;
var controls = [];
form.$addControl = function(control) {
controls.push(control);
$addControl.apply(this, arguments);
}
form.$removeControl = function(control) {
arrayRemove(controls, control);
$removeControl.apply(this, arguments);
}
form.$setPristine = function() {
element.removeClass(DIRTY_CLASS).addClass(PRISTINE_CLASS);
form.$dirty = false;
form.$pristine = true;
angular.forEach(controls, function(control) {
control.$setPristine();
});
}
},
};
},
};
return isNgForm ? angular.extend(angular.copy(formDirective), {restrict: 'EAC'}) : formDirective;
};
}
var ngFormDirective = formDirectiveFactory(true);
var formDirective = formDirectiveFactory();
angular.module('resettableForm', []).
directive('ngForm', ngFormDirective).
directive('form', formDirective).
directive('ngModel', function() {
return {
require: ['ngModel'],
link: function(scope, element, attrs, ctrls) {
var control = ctrls[0];
control.$setPristine = function() {
this.$dirty = false;
this.$pristine = true;
element.removeClass(DIRTY_CLASS).addClass(PRISTINE_CLASS);
}
},
};
});
})(angular);
ステップ2：モデルをリセットするメソッドをコントローラーに提供します
フォームをリセットするときは、モデルをリセットする必要があることに注意してください。コントローラでは、次のように書くことができます。
var myApp = angular.module('myApp', ['resettableForm']);
function MyCtrl($scope) {
$scope.reset = function() {
$scope.form.$setPristine();
$scope.model = '';
};
}
ステップ3：このメソッドをHTMLテンプレートに含める
<div ng-app="myApp">
<div ng-controller="MyCtrl">
<form name="form">
<input name="requiredField" ng-model="model.requiredField" required/> (Required, but no other validators)
<p ng-show="form.requiredField.$errror.required">Field is required</p>
<button ng-click="reset()">Reset form</button>
</form>
<p>Pristine: {{form.$pristine}}</p>
</div>
</dvi>