title: Angular ng-click giving Syntax Error: Token '{' invalid key at column 22 of the expression
body: <p>Before I post my question, just want to let you know I searched enough and couldnt find the solution. This issue is perplexing me.</p>
  
  <p>I have following code. First ng-click correctly inserts the ID in the function, but generates angular error (mentioned in subject). Second ng-click neither generates error nor inserts the ID, instead it renders the literal.</p>
  
  <p>I searched all the forums and most mentioned to use it like my 2nd ng-click but it is not working for me. Help required!</p>
  
  <pre><code>&lt;tr ng-repeat="registration in vm.filteredList"&gt;
      &lt;td&gt;{{registration.id}}&lt;/td&gt;
      &lt;td&gt;{{registration.dateModified | date}}&lt;/td&gt;
      &lt;td&gt;
          &lt;a class="btn btn-primary" ng-click="vm.editRegistration({{registration.id}})" href="#"&gt;E&lt;/a&gt;
          &lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#"&gt;D&lt;/a&gt;
      &lt;/td&gt;
  &lt;/tr&gt;
  </code></pre>
  
  <p><strong>ANSWER:</strong></p>
  
  <p>I did some testing and found out it is confusing for newbie because in HTML inspector of FF or Chrome developer toolbar, you will see that code will render</p>
  
  <pre><code>&lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#"&gt;D&lt;/a&gt;
  &lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#"&gt;D&lt;/a&gt;
  &lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(registration.id)" href="#"&gt;D&lt;/a&gt;
  </code></pre>
  
  <p>instead of</p>
  
  <pre><code>&lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(1)" href="#"&gt;D&lt;/a&gt;
  &lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(2)" href="#"&gt;D&lt;/a&gt;
  &lt;a class="btn btn-danger" ng-click="vm.deleteRegistration(3)" href="#"&gt;D&lt;/a&gt;
  </code></pre>
  
  <p>but when the actual function fires it will pass the right value. For example below function will receive and show 1,2,3 etc.</p>
  
  <pre><code>vm.deleteRegistration = function (id) { alert("ID: " + id)};
  </code></pre>
  
  <p>Hopefully it explains and helps.</p>