SO - 19267979

HTML

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js"></script>
<div style="border:solid;color:red;Margin-bottom:4px;">
  Click on Create Button to Generate the required li'sThe issue is that when there multiple Li the corresponding is getting called multiple time
  <ul id="ulTabList">
    <li ng-repeat="item in items" ng-click="OpenWorkGroupTab(item);">Text of Li
      <input type="button" value="btn" style="margin-left:1px;" ng-click="fn_btnClose(item,$event)">
    </li>
  </ul>
</div>
<div style="margin-top:10px;">
  <input type="button" ng-click="Addli()" value="Create" />
</div>

JavaScript

var app = angular.module('my-app', [], function() {

})

app.controller('AppController', function($scope, $compile) {
  var workGroupTab = "TestA"
  $scope.items = [];

$scope.Addli = function(){
$scope.items.push(Math.random());
    //in your case not matter what objects in array because you not use it inside view
}
  $scope.fn_btnClose = function(a,e) {
    console.log('clicked' +a);
    e.stopPropagation();
  }

  $scope.OpenWorkGroupTab = function(v) {
    console.log('Open Work group'+v);
  }
})