****注意我删除了一些我的其他功能,以便可以更快地读取代码.我不能清除表单.当我点击具有取消功能的按钮.我以为我可以设置一个默认的形式,但这并没有什么不同.
<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我正在尝试使用按钮命令wiht ng点击将我的表单设置为$setPristine.我虽然设置一个默认的形式将有所帮助,但没有发生任何事情提交
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');
}
我认为你使用错了.
$setPristine：
“这个方法可以被调用去除’ng-dirty’类,并将该表单设置为原始状态(ng-pristine类),此方法也将传播到此表单中包含的所有控件.
所以这只清除类而不是$scope变量.
你重新设置一个$scope.user变量,可以说：
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: "",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');
}
