title: HostListener and HostBinding do not remove original listener or original binding when used in a directive
body: <p>When creating a directive with <code>HostListener</code> or <code>HostBinding</code> and attaching it to a component or HTML element, the original listener or binding are not modified.</p>
  <p>Reading this post (<a href="https://stackoverflow.com/a/58567228/7365461">https://stackoverflow.com/a/58567228/7365461</a>) would lead me to believe that the original binding and original event listener would be replaced by the directive's <code>HostListener</code> and <code>HostBinding</code> but this is not the case as can be seen in this StackBlitz: <a href="https://stackblitz.com/edit/angular-ivy-kxpk7m?file=src%2Fapp%2Frandom.directive.ts&amp;file=src%2Fapp%2Fapp.component.html" rel="nofollow noreferrer">https://stackblitz.com/edit/angular-ivy-kxpk7m?file=src%2Fapp%2Frandom.directive.ts&amp;file=src%2Fapp%2Fapp.component.html</a>.</p>
  <p>When applying the <code>random</code> directive to the hello component, both the directive and component's click event handlers are ran. Changing the <code>name</code> input also has no effect with <code>HostBinding</code>.</p>
  <p>Does anybody know how I can remove the original event handlers and property bindings of <code>@Input()</code>s?</p>
  <p>Thanks in advance.</p>