 <p>Refer the sample <a href="https://jsfiddle.net/shashank2691/kx4s6pq0/2/" rel="nofollow">here</a>.</p> <p><strong>Code:</strong></p> <p><em>HTML:</em></p> <pre><code>&lt;div ng-app="app" ng-controller="test as vm"&gt; &lt;div test-dir="user" ng-repeat="user in vm.users"&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p><em>JS:</em></p> <pre><code>var app = angular.module('app', []); app.controller('test', function ($scope) { var vm = this; vm.users = [ { 'Name': 'Abc', 'Id': 1 }, { 'Name': 'Pqr', 'Id': 2 }, { 'Name': 'XYZ', 'Id': 3 } ]; $scope = vm; }); app.directive('testDir', function () { return { scope: { user: '=testDir' }, template: "&lt;div&gt;&lt;h4&gt;{{user.Id}}) {{user.Name}}&lt;/h4&gt;&lt;/div&gt;" } }); </code></pre>