我已付出你的jsfiddle爲您展示如何做到這一點有多種形式:https://jsfiddle.net/fpt5kcba/2/
正如你分配表單的名稱,name="mv.form"
您可以通過控制器中的相同方式訪問它。
angular.module('myApp', []).controller('myCtrl', function() {
var mv = this;
mv.reset = function() {
mv.text='';
mv.form.$setPristine();
}
});
編輯:
如果你想要的是讓它動態,看看這個的jsfiddle:https://jsfiddle.net/fpt5kcba/5/
這是這樣的:
<div ng-app="myApp" ng-controller="myCtrl as mv">
<div ng-repeat="form in mv.forms">
{{form.id}}
<form name="mv.{{form.id}}">
<input ng-model="form.text"><br>
<a href="#" ng-show="mv[form.id].$dirty" ng-click="mv.reset(form.id, $index)">reset</a>
</form>
</div>
</div>
控制器:
angular.module('myApp', []).controller('myCtrl', function ($scope) {
var mv = this;
mv.forms = [
{
id: "form1",
text: ""
},
{
id: "form2",
text: ""
}];
mv.values = {
form1: "",
form2: ""
};
mv.reset = function (formId, index) {
mv.text='';
mv.forms[index].text = "";
mv[formId].$setPristine();
}
});
總是要指望$ setPristine不用於清除字段。
將窗體設置爲其原始狀態。
可以調用此方法來刪除'ng-dirty'類並將 表單設置爲其原始狀態(ng-pristine類)。這種方法也將 傳播到這個表單中包含的所有控件。
當我們希望 在保存或重置表單後「重用」表單時,將表單設置回原始狀態通常很有用。
您不需要將表單傳遞給控制器,它可以在與控制器關聯的$ scope上使用。由於您使用的是'controllerAs'語法,並且您已經使用控制器名稱(「mv.form」中的「mv」)命名了表單,所以您只能使用'mv.form'訪問控制器中的表單。 ..並且不需要將它傳遞給你的'reset()'函數。 –
是的,我知道。但是我有許多形式和一種形式的功能。 –
你只是試圖通過重置功能重置**所有**表單元素?或者你是否想要重置一個表單元素,爲其提供該字段特有的重置功能? – jusopi