ng-repeat to create form input element
Description
The following code shows how to use ng-repeat to create form input element.
Example
<!doctype html>
<html ng-app="myApp" >
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.js"></script>
<script>
var app = angular.module('myApp', []);
<!--from w ww .jav a2s . c o m-->
app.controller('MainCtrl', function($scope) {
$scope.user = {
websites: [
{url: 'http://www.example.com'},
{url: 'http://www.java2s.com'}
]
};
$scope.remove = function(index) {
$scope.user.websites.splice(index, 1);
};
$scope.add = function() {
$scope.user.websites.push({ url: ''});
};
});
</script>
</head>
<body ng-controller="MainCtrl">
<div class="input-append" ng-repeat="website in user.websites">
<input type="url" ng-model="website.url">
<button class="btn" ng-click="remove($index)">X</button>
</div>
<button class="btn btn-small" ng-click="add()">Add</button>
<pre>{{user | json}}</pre>
</body>
</html>