Angular Test
by Avdhut Sonpethkar
HTML
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script>
<div class="container" ng-app="firstApp">
<div ng-controller="firstController">
<form class="form-inline" role="form" method="post">
<div class="form-group">
<lable for="username " class="control-label col-sm-2 ">Username : </lable>
<div class="col-sm-10">
<input type="text" name="username" placeholder="abcd123" id="username" ng-model="username" />
</div>
</div>
<div class="form-group">
<lable for="email" class="control-label col-sm-2">Email : </lable>
<div class="col-sm-10">
<input type="email" name="email" placeholder="[email protected]" id="email" ng-model="email" />
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<button class="btn btn-primary" type="button" ng-click="addUserInfo()">
<span class="glyphicon glyphicon-star"></span> Submit
</button>
</div>
</div>
</form>
<div class="col-sm-12">
<span class="text-primary" ng-bind="username"></span> , {{email}}
</div>
<table>
<tr>
<th>Username</th>
<th>Email</th>
</tr>
<tr ng-repeat="udata in userinfo">
<td>{{udata.username}}</td>
<td>{{udata.email}}</td>
</tr>
</table>
</div>
</div>
<script>
</script>
JavaScript
var firstapp = angular.module("firstApp", []);
var firstcontrller = firstapp.controller("firstController", function($scope) {
$scope.userinfo = [{
username: '',
email: ''
}];
$scope.addUserInfo = function() {
$scope.userinfo.push({ username: $scope.username, email: $scope.email
});
};
});