AngularJS click directive doesn't trigger function w/ Jade

admin

Administrator
Staff member
This is loosely based on the <a href="http://thecodebarbarian.wordpress.c...asily-validate-any-form-ever-using-angularjs/" rel="nofollow">MEAN Stack demo</a>: Mongo, Express, AngularJS, and NodeJS

I want to add a
Code:
delete
method to my controller in my Jade template like so

<em><strong>characters.jade</em></strong>

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`

I believe I'm just screwing up the
Code:
scope
of the
Code:
ng-click
as the
Code:
delete(...)
function isn't triggering even though it's within the `ng-controller="CharactersController" div?