In my angularJs application, all of data are loaded and displayed perfectly, but by clicking on delete prize button nothing happen. I use breakpoint and alert() in my deletePrize() method, but never this function not called and controls not enter to this function
I have a route in angularjs module like this:
...
            .when('/prizes', {templateUrl: '/assets/views/prizes/list.html', controller: PrizeListController})
...
and my controller:
 function PrizeListController($scope, Prize) {
    $scope.prizes = Prize.query();
    $scope.deletePrize = function (id) {
        alert('in delete method');
        Prize.delete({prizeId: id}, function () {
            toastr.success("جایزه حذف شد!");
            $location.path('/prizes');
        }, function () {
            toastr.error("خطا در عملیات");
        });
    };
}
and my partial HTML file:
  <h2>
    جوایز
    <button onclick="window.location='#/prizes/new'" class="btn btn-primary" style="float: left">ایجاد جایزه</button>
</h2>
<table class="table table-striped">
    <thead>
    <tr>
        <td>
            title
        </td>
        <td>
            description
        </td>
        <td>
            score value
        </td>
        <td>
            real value
        </td>
        <td>
            action
        </td>
    </tr>
    </thead>
    <tr ng-repeat="prize in prizes">
        <td><a href="#/prizes/{{prize.id}}">{{prize.title}}</a></td>
        <td>{{prize.description}}</td>
        <td>{{prize.scoreValue}}</td>
        <td>{{prize.realValue}}</td>
        <td>
            <button class="btn btn-danger" ng-click="deletePrize({{prize.id}})">حذف</button>
        </td>
    </tr>
</table>
Edit:
as mentioned in this question replacing deletePrize({{prize.id}}) with deletePrize(prize.id) does not resolve my problem
 
    