How to add ng-click handler dynamically
Issue is with this line of code:
$compile(generated)($scope);
Instead it should be:
$compile(generated.contents())($scope);
You can assign the function to a scope variable and depending on your business logic assign appropriate functions to your ng-click. In the below example $scope.addGeoFence() is added to the ng-click of "Add GeoFence" list-item
$scope.layout = [ {name: 'Home', icon: 'home'}, {name: 'Add Geofence', icon: 'add_location', click: $scope.addGeoFence}];$scope.addGeoFence = function() { console.log("calling addGeoFence()");}<md-list> <md-list-item ng-repeat="snav in layout"> <md-button class="md-raised" ng-click="(snav.click)()" flex> <md-icon md-font-library="material-icons">{{snav.icon}} </md-icon> <span>{{snav.name}}</span> </md-button> </md-list-item></md-list>