{"action":"created","issue":{"url":"https://api.github.com/repos/angular-ui/ui-sortable/issues/405","labels_url":"https://api.github.com/repos/angular-ui/ui-sortable/issues/405/labels{/name}","comments_url":"https://api.github.com/repos/angular-ui/ui-sortable/issues/405/comments","events_url":"https://api.github.com/repos/angular-ui/ui-sortable/issues/405/events","html_url":"https://github.com/angular-ui/ui-sortable/issues/405","id":115761560,"number":405,"title":"Sort-able directive with link function problem! ","user":{"login":"sszdh","id":7782078,"avatar_url":"https://avatars.githubusercontent.com/u/7782078?v=3","gravatar_id":"","url":"https://api.github.com/users/sszdh","html_url":"https://github.com/sszdh","followers_url":"https://api.github.com/users/sszdh/followers","following_url":"https://api.github.com/users/sszdh/following{/other_user}","gists_url":"https://api.github.com/users/sszdh/gists{/gist_id}","starred_url":"https://api.github.com/users/sszdh/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/sszdh/subscriptions","organizations_url":"https://api.github.com/users/sszdh/orgs","repos_url":"https://api.github.com/users/sszdh/repos","events_url":"https://api.github.com/users/sszdh/events{/privacy}","received_events_url":"https://api.github.com/users/sszdh/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":1,"created_at":"2015-11-08T21:16:10Z","updated_at":"2015-11-08T21:48:41Z","closed_at":null,"body":"Code to reproduce issue:\r\n\r\napp.js\r\n```javascript\r\nvar app = angular.module('App', ['ui.sortable']);\r\n\r\napp.controller('MainCtrl', ['$scope', MainCtrl]);\r\n\r\nfunction MainCtrl($scope) {\r\n  $scope.items = [\r\n    {id: 1, type: 'dog', name: 'galardo'},\r\n    {id: 2, type: 'cat', name: 'loossi'},\r\n    {id: 3, type: 'fish', name: 'sharkie'}\r\n  ];\r\n}\r\n\r\napp.directive('myDirective', ['$compile', myDirective]);\r\n\r\nfunction myDirective($compile) {\r\n  return {\r\n      restrict: 'EA',\r\n      replace: true,\r\n      //template: '<div ng-bind=\"item.name\" item=\"item\"></div>',\r\n      scope: {\r\n          type: \"@\",\r\n          item: \"=\"\r\n      },\r\n      link: link\r\n  };\r\n\r\n  function link(scope, element, attrs) {\r\n      var view = $compile('<div ng-bind=\"item.name\"></div>')(scope);\r\n      element.replaceWith(view);\r\n  }\r\n}\r\n\r\n```\r\n\r\nindex.html\r\n```html\r\n<div ui-sortable ng-model=\"items\">\r\n    <my-directive item=\"item\" ng-repeat=\"item in items\"></my-directive>\r\n </div>\r\n```\r\n\r\nConsole Error:\r\n```\r\nError: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: item in items, Duplicate key: undefined:undefined, Duplicate value: undefined\r\nhttp://errors.angularjs.org/1.4.7/ngRepeat/dupes?p0=item%20in%20items&p1=undefined%3Aundefined&p2=undefined\r\n    at http://localhost/angular-tests/lib/angular/angular.js:68:12\r\n\r\n```\r\nP.S: If  we use `template` property instead of `link` function, there is no issue.\r\n\r\nCheers."},"comment":{"url":"https://api.github.com/repos/angular-ui/ui-sortable/issues/comments/154876969","html_url":"https://github.com/angular-ui/ui-sortable/issues/405#issuecomment-154876969","issue_url":"https://api.github.com/repos/angular-ui/ui-sortable/issues/405","id":154876969,"user":{"login":"thgreasi","id":1295829,"avatar_url":"https://avatars.githubusercontent.com/u/1295829?v=3","gravatar_id":"","url":"https://api.github.com/users/thgreasi","html_url":"https://github.com/thgreasi","followers_url":"https://api.github.com/users/thgreasi/followers","following_url":"https://api.github.com/users/thgreasi/following{/other_user}","gists_url":"https://api.github.com/users/thgreasi/gists{/gist_id}","starred_url":"https://api.github.com/users/thgreasi/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/thgreasi/subscriptions","organizations_url":"https://api.github.com/users/thgreasi/orgs","repos_url":"https://api.github.com/users/thgreasi/repos","events_url":"https://api.github.com/users/thgreasi/events{/privacy}","received_events_url":"https://api.github.com/users/thgreasi/received_events","type":"User","site_admin":false},"created_at":"2015-11-08T21:48:41Z","updated_at":"2015-11-08T21:48:41Z","body":"Great finding!!!\nDoes the problem get fixed if you add a `track by id` in your ng-repeat???\nIf yes, then the case might be that there is a digest loop where your\ndirective isn't yet linked and the element hasn't yet been replaced, so\nsince there is no \"track by\", angular uses the actual html for tracking,\nresulting dupes.\nAny chance you can make a codepen example of this?\n\nOn Sun, Nov 8, 2015, 23:16 Soheil Samadzadeh <notifications@github.com>\nwrote:\n\n> Code to reproduce issue:\n>\n> app.js\n>\n> var app = angular.module('App', ['ui.sortable']);\n>\n> app.controller('MainCtrl', ['$scope', MainCtrl]);\n> function MainCtrl($scope) {\n>   $scope.items = [\n>     {id: 1, type: 'dog', name: 'galardo'},\n>     {id: 2, type: 'cat', name: 'loossi'},\n>     {id: 3, type: 'fish', name: 'sharkie'}\n>   ];\n> }\n>\n> app.directive('myDirective', ['$compile', myDirective]);\n> function myDirective($compile) {\n>   return {\n>       restrict: 'EA',\n>       replace: true,\n>       //template: '<div ng-bind=\"item.name\" item=\"item\"></div>',\n>       scope: {\n>           type: \"@\",\n>           item: \"=\"\n>       },\n>       link: link\n>   };\n>\n>   function link(scope, element, attrs) {\n>       var view = $compile('<div ng-bind=\"item.name\"></div>')(scope);\n>       element.replaceWith(view);\n>   }\n> }\n>\n> index.html\n>\n> <div ui-sortable ng-model=\"items\">\n>     <my-directive item=\"item\" ng-repeat=\"item in items\"></my-directive>\n>  </div>\n>\n> Console Error:\n>\n> Error: [ngRepeat:dupes] Duplicates in a repeater are not allowed. Use 'track by' expression to specify unique keys. Repeater: item in items, Duplicate key: undefined:undefined, Duplicate value: undefinedhttp://errors.angularjs.org/1.4.7/ngRepeat/dupes?p0=item%20in%20items&p1=undefined%3Aundefined&p2=undefined\n>     at http://localhost/angular-tests/lib/angular/angular.js:68:12\n>\n> P.S: If we use template property instead of link function, there is no\n> issue.\n>\n> Cheers.\n>\n> —\n> Reply to this email directly or view it on GitHub\n> <https://github.com/angular-ui/ui-sortable/issues/405>.\n>\n-- \n*Thodoris Greasidis*\nComputer, Networking &\nCommunications Engineer\n"}}