AngularJS ng-click and nothing happens

Question

AngularJS

var theApp = angular.module('theApp', []);
theApp.controller('ContentController', ['$scope', function ($scope) {

}]);


theApp.controller('MenuSideController', ['$scope', 'CategoryService', 
    function ($scope, CategoryService){
        CategoryService.getList()
        .success(function(list){
            $scope.list = list;
        });
    }
]);


function menuType(id) {
    console.log(id);
    //do something
}

HTML

<ul>
                        <li ng-repeat="company in list"><a href="#" ng-click="menuType(company.id)">{{ company.name }}</a></li>
                    </ul>

I'm trying to get a click method working using AngularJS but nothing works, there is no error message or even a console.log. What am I doing wrong?

Answer 1

The expression passed to ngClick is evaluated in the current scope. This means you have to add the function to the $scope variable in the controller:

theApp.controller('MenuSideController', ['$scope', 'CategoryService', 
  function ($scope, CategoryService){
    CategoryService.getList()
    .success(function(list){
        $scope.list = list;
    });
    $scope.menuType = function(id) {
      // do things here
    }
  }
]);