{"action":"created","issue":{"url":"https://api.github.com/repos/jvandemo/angular-growl-notifications/issues/25","repository_url":"https://api.github.com/repos/jvandemo/angular-growl-notifications","labels_url":"https://api.github.com/repos/jvandemo/angular-growl-notifications/issues/25/labels{/name}","comments_url":"https://api.github.com/repos/jvandemo/angular-growl-notifications/issues/25/comments","events_url":"https://api.github.com/repos/jvandemo/angular-growl-notifications/issues/25/events","html_url":"https://github.com/jvandemo/angular-growl-notifications/issues/25","id":142981494,"number":25,"title":"Looses reference on state change - angular ui-router","user":{"login":"mufsir","id":15102029,"avatar_url":"https://avatars.githubusercontent.com/u/15102029?v=3","gravatar_id":"","url":"https://api.github.com/users/mufsir","html_url":"https://github.com/mufsir","followers_url":"https://api.github.com/users/mufsir/followers","following_url":"https://api.github.com/users/mufsir/following{/other_user}","gists_url":"https://api.github.com/users/mufsir/gists{/gist_id}","starred_url":"https://api.github.com/users/mufsir/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mufsir/subscriptions","organizations_url":"https://api.github.com/users/mufsir/orgs","repos_url":"https://api.github.com/users/mufsir/repos","events_url":"https://api.github.com/users/mufsir/events{/privacy}","received_events_url":"https://api.github.com/users/mufsir/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":8,"created_at":"2016-03-23T14:51:55Z","updated_at":"2016-09-29T23:45:48Z","closed_at":null,"body":"When state change happens, I'm not able to close the existing Growl notification using `$growlNotification.remove();`. It only closes when time-out occurs."},"comment":{"url":"https://api.github.com/repos/jvandemo/angular-growl-notifications/issues/comments/250623293","html_url":"https://github.com/jvandemo/angular-growl-notifications/issues/25#issuecomment-250623293","issue_url":"https://api.github.com/repos/jvandemo/angular-growl-notifications/issues/25","id":250623293,"user":{"login":"tyriker","id":3468026,"avatar_url":"https://avatars.githubusercontent.com/u/3468026?v=3","gravatar_id":"","url":"https://api.github.com/users/tyriker","html_url":"https://github.com/tyriker","followers_url":"https://api.github.com/users/tyriker/followers","following_url":"https://api.github.com/users/tyriker/following{/other_user}","gists_url":"https://api.github.com/users/tyriker/gists{/gist_id}","starred_url":"https://api.github.com/users/tyriker/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tyriker/subscriptions","organizations_url":"https://api.github.com/users/tyriker/orgs","repos_url":"https://api.github.com/users/tyriker/repos","events_url":"https://api.github.com/users/tyriker/events{/privacy}","received_events_url":"https://api.github.com/users/tyriker/received_events","type":"User","site_admin":false},"created_at":"2016-09-29T23:45:48Z","updated_at":"2016-09-29T23:45:48Z","body":"This worked for the Plunker, but not in practice. There were 2 issues I faced and resolved.\r\n\r\nFirst, the directive was only removing itself from the DOM, not the entire `<growl-notification>` element. But, easy fix... just call `growlNotificationController.remove()` instead and let it do its thing.\r\n\r\nSecond, since the event handler was running \"outside\" of Angular, the removal wasn't happening until the next `$digest` cycle happened. FIxed by wrapping the `growlNotificaitonController.remove` call in `$scope.$apply(...)`. I don't know how/why it works in the Plunker.\r\n\r\nHere's the code I ended up with:\r\n```\r\n.directive('growlCloseButton', function () {\r\n  return {\r\n    require: '^^growlNotification',\r\n    restrict: 'E',\r\n    link: function ($scope, element, attributes, growlNotificationController) {\r\n      var handler = function () {\r\n        $scope.$apply(growlNotificationController.remove());\r\n      };\r\n\r\n      element.on('click', handler);\r\n\r\n      $scope.$on('$destroy', function () {\r\n        if (growlNotificationController.timer && growlNotificationController.timer.then) {\r\n          growlNotificationController.timer.then(function () {\r\n            element.off('click', handler);\r\n          });\r\n        }\r\n      });\r\n    },\r\n    template: '<button type=\"button\" class=\"close pull-right\"><span>x</span></button>'\r\n  };\r\n});\r\n```\r\n\r\nAwesome work BTW!"}}
{"actor":{"display_login":"tyriker"}}