<html>
<head>
<script src="Scripts/angular.min.js"></script>
<style>
table, th, td
{
border: 1px solid grey;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd)
{
background-color: #ffe6e6;
}
table tr:nth-child(even)
{
background-color: #ccffcc;
}
</style>
</head>
<body>
<h2>AngularJS Sample Application</h2>
<div ng-app="myModule" ng-controller="employeeCtrl">
<table>
<tr><td>Enter first name: <input type = "text" ng-model = "Employee.firstName"></td></tr>
<tr><td>Enter last name: <input type = "text" ng-model = "Employee.lastName"></td></tr>
</table>
<br>
<br>
You are entering: {{Employee.fullName()}}
</div>
<script>
var myApp = angular.module("myModule", []);
myApp.controller('employeeCtrl', function ($scope)
{
$scope.Employee =
{
firstName: "Raj",
lastName: "Parihar",
fullName: function ()
{
var empObject;
empObject = $scope.Employee;
return empObject.firstName + " " + empObject.lastName;
}
};
});
</script>
</body>
</html>