我有一个表单,我在我的输入中使用了 required 标签
- 这工作正常但在我的提交按钮上我有 ng-click="visible = false"
在提交数据时隐藏表单。
如果所有验证都正确,我怎样才能让它只设置为 false?
App.js
$scope.newBirthday = function(){
$scope.bdays.push({name:$scope.bdayname, date:$scope.bdaydate});
$scope.bdayname = '';
$scope.bdaydate = '';
};
HTML:
<form name="birthdayAdd" ng-show="visible" ng-submit="newBirthday()">
<label>Name:</label>
<input type="text" ng-model="bdayname" required/>
<label>Date:</label>
<input type="date" ng-model="bdaydate" required/>
<br/>
<button class="btn" ng-click="visible = false" type="submit">Save</button>
</form>
最佳答案
如果您为表单命名,FormController 将根据其名称在最近的 Controller 范围内公开。所以在你的情况下,你有一个类似的结构
<div ng-controller="MyController">
<!-- more stuff here perhaps -->
<form name="birthdayAdd" ng-show="visible" ng-submit="newBirthday()">
<label>Name:</label>
<input type="text" ng-model="bdayname" required/>
<label>Date:</label>
<input type="date" ng-model="bdaydate" required/>
<br/>
<button class="btn" ng-click="onSave()" type="submit">Save</button>
</form>
</div>
现在在你的 Controller 中
function MyController($scope){
// the form controller is now accessible as $scope.birthdayAdd
$scope.onSave = function(){
if($scope.birthdayAdd.$valid){
$scope.visible = false;
}
}
}
如果表单中的输入元素有效,则表单有效。希望这可以帮助。
关于html - Angular JS HTML5 验证,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15455451/