AngularJS Example:

by Upal_Roy

HTML

<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">

<html ng-app="list">
<head>
</head>
<body ng-controller="peopleListCtrl">
<br />
<div ng-repeat="people in persons">
  <h3>
    {{people.name}}
    {{people.job}}
    {{people.home}}
  </h3>
</div>
<br />

<form name="personForm" ng-submit="addPerson()" >

  <input type="text" ng-model="person.name"/>
  Name:{{person.name}}
  <br />
  <input type="text" ng-model="person.job"/>
  job:{{person.job}}
  <br />
  <input type="text" ng-model="person.home"/>
  home:{{person.home}}
<br />
  <input type="submit" value="submit" />
</form>

</body>
</html>

JavaScript

(function() {
    var app = angular.module('list', []);

    app.controller('peopleListCtrl',['$scope', function($scope){
    var plists = [
        { name: 'alon', job: 'web dev', home:'nir tzvi' },
        { name: 'ben', job: 'katbamflighter', home:'nir tzvi' },
        { name: 'shiraz', job: 'dentist assistant', home:'hadera west' }
    ];
        $scope.persons = plists;
		$scope.persion = [];
        $scope.addPerson = function() {
            console.log("working");
            if ($scope.person) {
                $scope.persons.push($scope.person);
                $scope.person=null;
            }
        };
    }]);
})();