ons-button and angular : ng-click not working

Question

this is my js code :

var application = angular.module('app', ['onsen']);

application.controller('ItemController',function($scope){
    $scope.local = [];
    $scope.loadPresentation = function(id){};
}

and this is my ons-list :

<ons-list id ="list" style="margin:0px;padding:0px;" ng-controller="ItemController">
  <ons-list-item modifier="chevron" ng-repeat="item in local">
    <ons-carousel  style="height: 100%;width :100%;position: absolute;left: 0;top: 0;" swipeable initial-index="1" auto-scroll>

      <ons-carousel-item class="list-action-menu">
        <ons-button modifier = "quiet" ng-click="menu.setMainPage('default.html', {closeMenu: true, callback: function(){loadPresentation(0);}});">
          {{item.name}}
        </ons-button>
      </ons-carousel-item>

      <ons-carousel-item class="list-action-menu">
        <ons-button ng-click="local.splice($index, 1);runtime.local=local">
          Remove
          <ons-icon icon="ion-trash-a">
        </ons-button>
      </ons-carousel-item>

    </ons-carousel>
  </ons-list-item>
</ons-list>

The second button works fine but the first ng-click in the first carousel item is not firing but it works with the function outside the scope when i use onclick.

Answer 1

ng-click expects Angular expressions, what means function declarations are not allowed. Just create the callback in your controller and link it from your view:

$scope.myCallback = function(){
   $scope.loadPresentation(0);
};

ng-click="menu.setMainPage('newpage.html', {closeMenu: true, callback: myCallback});".

Hope it helps.

Edit: callback with parameters

$scope.customSetMainPage = function(params) {
   $scope.menu.setMainPage('newpage.html', {
     callback: function() {
       console.log(params);
     }
   });
};