title: AngularJS click directive doesn't trigger function w/ Jade
body: <p>This is loosely based on the <a href="http://thecodebarbarian.wordpress.com/2013/05/12/how-to-easily-validate-any-form-ever-using-angularjs/" rel="nofollow">MEAN Stack demo</a>: Mongo, Express, AngularJS, and NodeJS</p>
  
  <p>I want to add a <code>delete</code> method to my controller in my Jade template like so</p>
  
  <p><em><strong>characters.jade</em></strong>       </p>
  
  <pre><code>script
      function CharactersController($scope, $http, $window){
          $scope.charactersList = [];
  
          $scope.newCharacter = {};
  
          $scope.init = function(charactersList){
              $scope.charactersList = charactersList;
          }
  
          $scope.save = function(form){
  
          }
  
          $scope.delete = function(id){
              console.log('delete: '+id);
          }
      }
  body
      h1  Characters
      div(ng-controller="CharactersController", ng-init="init( #{JSON.stringify(charactersList)} );") Create a new character:
          br
          form(name="charactersForm", ng-submit="save(charactersForm)")
              input(type="string", ng-model="newCharacter.firstName", name="firstName", placeholder="Firstname...")
  
              input(type="submit")
          hr
          div(ng-repeat="character in charactersList.characters")
              {{character.lastName}}, {{character.firstName}} - Quantity: {{character.quantity}} 
              button(ng-click="delete('{{character._id}}')") remove`
  </code></pre>
  
  <p>I believe I'm just screwing up the <code>scope</code> of the <code>ng-click</code> as the <code>delete(...)</code> function isn't triggering even though it's within the `ng-controller="CharactersController" div?</p>