title: Pass a function as a parameter to (click) event through Angular component
body: <p>I'm trying to create a component with a cancel and send buttons to avoid c&amp;p on each form but I can't find a way to pass functions as a parameter to the component selector</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;btn-submit [cancelFunction]='test' [acceptFunction]='test'&gt;&lt;/btn-submit&gt;
  </code></pre>
  
  <p>TS Parent:</p>
  
  <pre><code>test = () =&gt; console.log("this is a test");
  </code></pre>
  
  <p>TS Child:</p>
  
  <pre><code>import { Component, Input } from '@angular/core';
  
  @Component({
    selector: 'btn-submit',
    styleUrls: ['./btn.component.scss'],
    template: `
            &lt;button class="btn" click="cancelFunction()"&gt;
                &lt;fa name="times"&gt;&lt;/fa&gt;
            &lt;/button&gt;
            &lt;button class="btn" click="acceptFunction()"&gt;
                &lt;fa name="check"&gt;&lt;/fa&gt;
            &lt;/button&gt;
    `
  })
  
  export class BtnSubmitComponent {
    @Input() cancelFunction: any;
    @Input() acceptFunction: any;
  }
  </code></pre>