我试图在用户点击提交按钮时清除表单数据和表单状态。问题的关键是:
http://plnkr.co/edit/9JFafkjt4ceSoknlKZBF?p=preview
html是:
<div id="contactForm" class="container">
<form class="horizontal" name="userForm" data-ng-submit="sendEmail(user)">
<div class="col-md-12">
<div class="pull-left">
<div class="form-group">
<label for="companyName">Frima</label>
<input type="text" id="companyName" class="form-control" title="Firma" name="companyName" pattern="[A-Za-z0-9ÀÁÄÈÉËÌÍÏÒÓÖÙÚÜßàáäèéëìíïòóöùúü]*+" data-ng-model="user.companyName">
</div>
<div class="form-group">
<label for="vorname">Vorname*</label>
<input type="text" data-ng-model="user.vorname" pattern="[A-Za-z0-9ÀÁÄÈÉËÌÍÏÒÓÖÙÚÜßàáäèéëìíïòóöùúü]+" id="vorname" class="form-control" title="Ihr Vorname" required>
</div>
<div class="form-group">
<label for="nachname">Nachname*</label>
<input type="text" data-ng-model="user.nachname" id="nachname" pattern="[A-Za-z0-9ÀÁÄÈÉËÌÍÏÒÓÖÙÚÜßàáäèéëìíïòóöùúü]+" title="Ihr Nachname" class="form-control" required>
</div>
<div class="form-group">
<label for="telefonnummer">Telefonnummer</label>
<input type="number" id="telefonnummer" data-ng-model="user.telefonnummer" max-length="14" min-length="11" width="100" class="form-control">
</div>
<div class="form-group">
<label for="email">Email*</label>
<input type="email" id="email" data-ng-model="user.email" class="form-control" required novalidate>
</div>
</div>
<div class="pull-right">
<div class="form-group text-area-group">
<label for="message">Nachtricht</label>
<textarea type="text" id="message" data-ng-model="user.message" rows="15" class="form-control" required></textarea>
</div>
</div>
</div>
<div class="form-group button-group text-center">
<button type="submit" id="send" class="btn btn-default">Submit</button>
</div>
</form>
</div>
控制器是:
.controller('simpleApp', ['$scope', function ($scope){
$scope.user = {};
$scope.sendEmail = function (user) {
$scope.userForm.$setPristine(); //clear the state
$scope.user = {}; //empty the form
var telefon = 0;
var message = 'no message';
console.log(user);
if(user.telefonnummer != 'undefined') {
telefon = user.telefonnummer;
}
if(user.message != 'undefined') {
message = user.message;
}
var emailArray = {
'subject': 'Contact Request',
'CompanyName': user.companyName,
'Vorname': user.vorname,
'Nachname': user.nachname,
'Telefonnummer': telefon,
'Email': user.email,
'Message': message,
};
};
}]);
问题是:它适用于plunker,但不适用于我正在处理的应用程序。
有一些范围相关的问题,我忽略了这一点。控制台还为$ scope.userForm提供了错误,未定义$ scope.user不可用。
现在问题是$ setPristine()不起作用。因此,如果我显示一些错误并且用户对其进行了更正,它将继续发送先前的状态,这将导致相同的错误。
谢谢。