title: How can I bind click event to an angular2 template interpolation?
body: <p>Is it possible to bind click event to an interpolation? because when I am trying to execute the following code I get the following </p>
  
  <p>ERROR Error: Uncaught (in promise): </p>
  
  <p>Error: Template parse errors:</p>
  
  <p>Parser Error: Got interpolation ({{}}) where expression was expected at column 7 in [upload({{config.fileLocation}})]</p>
  
  <p>this is the template where we have faulty interpolation, </p>
  
  <pre><code>  &lt;mat-card-actions&gt;
        &lt;button mat-raised-button type="button" (click)="upload({{config.fileLocation}})"&gt;Upload&lt;/button&gt;
    &lt;/mat-card-actions&gt;
  </code></pre>
  
  <p>and this is the angular component which is desired to be executed. </p>
  
  <pre><code>  upload(location = "/tmp/") {
    this.loader.open();
  
    const fileBrowser = this.fileInput.nativeElement;
    if (fileBrowser.files &amp;&amp; fileBrowser.files[0]) {
      const formData: FormData = new FormData();
      formData.append('file', fileBrowser.files[0]);
      formData.append('data', JSON.stringify({
        "method": "filesystem.put",
        "params": [location + fileBrowser.files[0].name, { "mode": "493" }]
      }));
  
      this.http.post(this.apiEndPoint, formData).subscribe(
        (data) =&gt; {
          this.loader.close();
          this.snackBar.open("your files are uploaded", 'close', { duration: 5000 });
        },
        (error) =&gt; {
          this.loader.close();
          this.dialog.errorReport(error.status, error.statusText, error._body);
  
        }
      );
    };
  }
  </code></pre>