AngularJS ng-click not invoked where dom inside repeat

When the ng-repeat area in my code example is executed the ng-click actions are not working. Although if moved outside the ng-repeat it would work. Which am not sure how to solve or what is causing this to happen,

my HTML

<table class="table table-bordered table-hover" id="my-vehicles-table" ng-controller="VehicleController">
                <tbody>
                    <tr ng-repeat="car in cars">
                        <td><a href="{% ng car.get_absolute_url %}">{% ng car._get_model_display.make_display %} {% ng car._get_model_display.model_display %} {% ng car._get_model_display.trim_display %}</a></td>
                        <td>{% ng car.created_since %}</td>
                        <td>{% ng car.view_count %}</td>
                        <td>
                            <a href="#" ng-click="delete($event, {% ng car.id %})" class="btn btn-danger btn-mini delete-btn">{% trans 'Delete' %}</a>
                            <a href="#" ng-model="edit" class="btn btn-primary btn-mini edit-btn">{% trans 'Edit' %}</a>
                        </td>
                    </tr>
                </tbody>
</table>

where by {% ng xxx %} will output {{ xx }} this is the django template tag for it. The content is rendered normally, even inside the anchor for delete, I can see delete($event, num) so its populating the values correctly.

But when I click the delete anchor its not invoking the function delete from my following controller

'use strict';

function VehicleController($scope, car) {
    car.query(
        // params
        {created_by: '1'},
        // success
        function(data) {
            $scope.cars = data.objects;
        },
        // error
        function(data) {

        }
    );

    var init = function() {

    };



    $scope.delete = function($event) {
        console.log('dude');
//        car.delete({id: id});
    }


    // initialize values
    init();


}