{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular/issues/1250","labels_url":"https://api.github.com/repos/angular/angular/issues/1250/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular/issues/1250/comments","events_url":"https://api.github.com/repos/angular/angular/issues/1250/events","html_url":"https://github.com/angular/angular/issues/1250","id":66772952,"number":1250,"title":"Create Emitter (as replacement for EventEmitter)","user":{"login":"mhevery","id":111951,"avatar_url":"https://avatars.githubusercontent.com/u/111951?v=3","gravatar_id":"","url":"https://api.github.com/users/mhevery","html_url":"https://github.com/mhevery","followers_url":"https://api.github.com/users/mhevery/followers","following_url":"https://api.github.com/users/mhevery/following{/other_user}","gists_url":"https://api.github.com/users/mhevery/gists{/gist_id}","starred_url":"https://api.github.com/users/mhevery/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mhevery/subscriptions","organizations_url":"https://api.github.com/users/mhevery/orgs","repos_url":"https://api.github.com/users/mhevery/repos","events_url":"https://api.github.com/users/mhevery/events{/privacy}","received_events_url":"https://api.github.com/users/mhevery/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":{"url":"https://api.github.com/repos/angular/angular/milestones/21","html_url":"https://github.com/angular/angular/milestones/M7:%20GT%20Customer%20(blocking)","labels_url":"https://api.github.com/repos/angular/angular/milestones/21/labels","id":1036683,"number":21,"title":"M7: GT Customer (blocking)","description":"","creator":{"login":"mhevery","id":111951,"avatar_url":"https://avatars.githubusercontent.com/u/111951?v=3","gravatar_id":"","url":"https://api.github.com/users/mhevery","html_url":"https://github.com/mhevery","followers_url":"https://api.github.com/users/mhevery/followers","following_url":"https://api.github.com/users/mhevery/following{/other_user}","gists_url":"https://api.github.com/users/mhevery/gists{/gist_id}","starred_url":"https://api.github.com/users/mhevery/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/mhevery/subscriptions","organizations_url":"https://api.github.com/users/mhevery/orgs","repos_url":"https://api.github.com/users/mhevery/repos","events_url":"https://api.github.com/users/mhevery/events{/privacy}","received_events_url":"https://api.github.com/users/mhevery/received_events","type":"User","site_admin":false},"open_issues":20,"closed_issues":17,"state":"open","created_at":"2015-03-24T16:31:29Z","updated_at":"2015-04-07T07:23:36Z","due_on":"2015-04-11T07:00:00Z","closed_at":null},"comments":2,"created_at":"2015-04-07T04:36:19Z","updated_at":"2015-04-07T14:45:56Z","closed_at":null,"body":"Current `@EventEmitter` has fallowing issues:\r\n\r\n* It pollutes the constructor.\r\n* It makes it difficult to unit test the code because it requires a lot of mock code.\r\n\r\n## Replacement\r\n\r\nUse inline `Emitter` class which reverses the dependency. \r\n\r\n```\r\nclass Emitter {\r\n  listener; // we only support one\r\n  constructor() {\r\n    this.listener = null;\r\n  }\r\n  emit(data) {\r\n    return if (this.listener) this.listener(data);\r\n  }\r\n}\r\n```\r\n\r\nHere is what the code would look like.\r\n\r\n```\r\n@Component({\r\n  selector: 'my-component',\r\n  events: ['open', 'close']\r\n})\r\n@View(...)\r\nclass MyComponent {\r\n  open:Emitter;\r\n  close:Emitter;\r\n\r\n  constructor() {\r\n    this.open = new Emitter();\r\n    this.close = new Emitter();\r\n  }\r\n}\r\n```\r\n\r\nprevious code:\r\n\r\n```\r\n@Component({\r\n  selector: 'my-component'\r\n  // events not listed here.\r\n})\r\n@View(...)\r\nclass MyComponent {\r\n  open:Function;\r\n  close:Function;\r\n\r\n  constructor(@EventEmitter('open') open:Function, @EventEmitter('close') close:Function) {\r\n    this.open = open;\r\n    this.close = close;\r\n  }\r\n}\r\n```\r\n\r\n\r\n## Rx and Streams\r\n\r\nAngular should be able to consume not only `Emitter` but also `Rx` and `Streams`. (We prefer `Emitter` because it is much more light weight and synchronous)"},"comment":{"url":"https://api.github.com/repos/angular/angular/issues/comments/90589976","html_url":"https://github.com/angular/angular/issues/1250#issuecomment-90589976","issue_url":"https://api.github.com/repos/angular/angular/issues/1250","id":90589976,"user":{"login":"tbosch","id":690815,"avatar_url":"https://avatars.githubusercontent.com/u/690815?v=3","gravatar_id":"","url":"https://api.github.com/users/tbosch","html_url":"https://github.com/tbosch","followers_url":"https://api.github.com/users/tbosch/followers","following_url":"https://api.github.com/users/tbosch/following{/other_user}","gists_url":"https://api.github.com/users/tbosch/gists{/gist_id}","starred_url":"https://api.github.com/users/tbosch/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tbosch/subscriptions","organizations_url":"https://api.github.com/users/tbosch/orgs","repos_url":"https://api.github.com/users/tbosch/repos","events_url":"https://api.github.com/users/tbosch/events{/privacy}","received_events_url":"https://api.github.com/users/tbosch/received_events","type":"User","site_admin":false},"created_at":"2015-04-07T14:45:55Z","updated_at":"2015-04-07T14:45:55Z","body":"Could we have the same for @PropertySetter?\n\nEg\n@Decorator(\nsetters: ['value']\n)\nClass MyDecirator {\nConstructor() { this.value = new PropertySetter(); }\n}\n\nSetting properties via PropertySetter and emitting events is very similar!\nOn Tue, Apr 7, 2015 at 5:50 AM Pascal Precht <notifications@github.com>\nwrote:\n\n> @mhevery <https://github.com/mhevery> How is the relation ship between\n> the emitter and the emitter name set up then?\n>\n> Having this code:\n>\n>   constructor(@EventEmitter('open') open:Function, @EventEmitter('close') close:Function) {\n>     this.open = open;\n>     this.close = close;\n>   }\n>\n> We know, that open:Function belongs to @EventEmitter('open') because it\n> is it's annotation. But in your proposed code:\n>\n> @Component({\n>   selector: 'my-component',\n>   events: ['open', 'close']\n> })\n> @View(...)class MyComponent {\n>   open:Emitter;\n>   close:Emitter;\n>\n>   constructor() {\n>     this.open = new Emitter();\n>     this.close = new Emitter();\n>   }\n> }\n>\n> How do we for which event this.open and this.close is an emitter? There's\n> no direct relation, or would this be a name to name mapping?\n>\n> —\n> Reply to this email directly or view it on GitHub\n> <https://github.com/angular/angular/issues/1250#issuecomment-90537431>.\n>\n"}}