<!DOCTYPE html>
<html>
<head>
<link data-require="bootstrap-css@3.3.1" data-semver="3.3.1" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<script src="https://code.angularjs.org/1.2.16/angular.js"></script>
<script type="text/javascript" src="https://cdn.rawgit.com/nidhishkrishnan/ngListSelect/master/ngListSelect.js"></script>
<script src="script.js"></script>
<link rel="stylesheet" href="style.css" />
</head>
<body ng-app="app">
<div ng-controller="MainCtrl">
<br/>
<ng-list-select selected-list="selectedList" width="700px" key="name" available-list="availableList"></ng-list-select>
<br/>
<br/>
<b>availableList::</b>{{availableList | json}}
<br />
<b>selectedList::</b>{{selectedList| json}}
</div>
</body>
</html>
angular.module('app', ['ngListSelect'])
.controller('MainCtrl', function($scope) {
$scope.availableList = [{name: "Nidhish", email: "nidhish@gmail.com"},
{name: "John", email: "john@gmail.com"},
{name: "Avinash", email: "avinash@gmail.com"},
{name:"Priya", email: "priya@gmail.com"},
{name:"Anu", email: "anu@gmail.com"},
{name:"Manu", email: "manu@gmail.com"}];
$scope.selectedList = [];
});
/* Styles go here */