René's URL Explorer Experiment

{"@context":"https://schema.org","@type":"DiscussionForumPosting","headline":"Input change event bubbling into custom component change event","articleBody":"**I'm submitting a ...**  (check one with \"x\")\r\n```\r\n[x] bug report =\u003e search github for a similar issue or PR before submitting\r\n[ ] feature request\r\n[ ] support request =\u003e Please do not submit support request here, instead see https://github.com/angular/angular/blob/master/CONTRIBUTING.md#question\r\n```\r\n\r\n**Current behavior**\r\nA custom component exposes an event named `change`: `@Output() change = new EventEmitter\u003cMyEventArg\u003e(true);`. Component contains a (reactive) form, which in turn holds an `\u003cinput\u003e` node whose `(change)` event is not bound to any handler.\r\nWhen input loses its focus, e.g. after user types in then tabs or clicks away, the **custom component** `change` event is fired, receiving a JS `Event` object as passed argument, totally unrelated to `MyEventArg` type. It seems like the inner input change event, while bubbling up, gets caught and handled by custom component change event.\r\n\r\n**Expected behavior**\r\nWhen input loses its focus, the input change event should not be caught by custom component. So custom change event should **not** fire unexpectedly, with unwanted arguments.\r\n\r\n**Minimal reproduction of the problem with instructions**\r\nSee plunk at https://plnkr.co/edit/M8KSb62Tqh7bT01PTYJ3?p=preview.\r\nAnyway, it is enough to:\r\n\r\n1. define a custom component wrapping an input, \r\n1. define a `change` output event on custom component, \r\n1. bind custom component change event to some external handler\r\n1. then type into input and let input lose focus.\r\n\r\n**What is the motivation / use case for changing the behavior?**\r\nI'd like to be able to name the change event on a custom component as `change`, and not something else like `changed` or `myComponentChange`. By the way, that *change* name is also used in the official angular tutorial on custom component.\r\n\r\n**Please tell us about your environment:**\r\nIt should not matter at all, just in case: Win 10 64bit, npm 3.9.5\r\n\r\n* **Angular version:** 2.4.2\r\n\r\n* **Browser:** Tried on Chrome 55.0.2883.87 m\r\n \r\n* **Language:** TypeScript 2.0.6\r\n\r\n* ~**Node (for AoT issues):** `node --version` =~\r\n\r\nI tried searching on the web for any \"reserved\" event names, but instead I found an official doc page using that name for a custom component. I tried searching among the issues for anything similar, but it was not easy to refine search with terms like \"change\" and \"event\", but on first result pages could not find anything.","author":{"url":"https://github.com/GiuseppePiscopo","@type":"Person","name":"GiuseppePiscopo"},"datePublished":"2017-01-18T21:43:13.000Z","interactionStatistic":{"@type":"InteractionCounter","interactionType":"https://schema.org/CommentAction","userInteractionCount":8},"url":"https://github.com/13997/angular/issues/13997"}