angularJS学习之路（十四）---ng-form
徐翔
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<form name="signup_form" ng-controller="FormController" ng-submit="submitForm()" >
<div ng-repeat="field in fields" ng-form="signup_form_input">
<input type="text" name="dynamic_input" ng-required="field.isRequired" ng-model="field.name" placeholder="{{field.placeholder}}" />
<div ng-show="signup_form_input.dynamic_input.$dirty && signup_form_input.dynamic_input.$invalid">
<span class="error" ng-show="signup_form_input.dynamic_input.$error.required">The field is required.</span>
</div>
</div>
<button type="submit" ng-disabled="signup_form.$invalid">Submit All</button>
</form>
<script type="text/javascript" src="../js/angular.min.js"></script>
<script>
var app = angular.module('myApp', []);
app.controller('FormController', function($scope) {
$scope.fields = [{
placeholder: 'Username',
isRequired: true
}, {
placeholder: 'Password',
isRequired: true
}, {
placeholder: 'Email (optional)',
isRequired: false
}];
$scope.submitForm = function() {
alert("it works!");
};
});
</script>
</body>
</html>
ng-form 用来在一个表单中嵌套 另外一个表单
类似资料：