Ng-click not working in div

Question

I've got a menu that appears when I click on a button. Well, into that menu, I have pairs of spans: icon-title. Pretty straightforward, I guess.

Well, somehow, these spans don't call my controller method when I click on them. I tried wrapping these pairs in divs and setting the ng-click on them, but that does not work either.

This is my contextual menu:

<div class="opciones" ng-hide="optionsHide">
      <div>
        <span class="glyphicon glyphicon-lock icono"></span> <span class="optionsLabel">Encrypt</span>
      </div><br>
      <div ng-click="removeNote()">
        <span class="glyphicon glyphicon-trash icono"></span><span class="optionsLabel">&nbspDelete</span><br>
      </div><br>
      <div>
      <span class="glyphicon glyphicon-wrench icono"></span><span class="optionsLabel">&nbspOptions</span>
      </div>
    </div>

Currently, I'm only focused on the "removeNote()" function. I've got both angular and node methods ready to test, but I just can't use them since I can't perform the click.

This is the function, inside the working controller:

    $scope.removeNote = function(){
      $http.post('/removeNote', $scope.mainNote).success(function(data){
        console.log("Note removed");
        console.log(data);
        loadNotes();
        }).error(function(err){
          console.log("ERROR ON DELETE");
          console.log(err);
          });
    }

Why ng-click does not call this function? Am I missing something?

edit:

Controller declaration:

Upper controller:

 app.controller('mainCtrl', ['$scope', '$http', '$filter', 'focus', function($scope, $http, $filter, focus){

Inner:

app.controller('contentCtrl', ['$scope', '$q', '$timeout', function($scope, $q, $timeout) {

Use:

<body ng-controller="mainCtrl" ng-cloak>
    // Things
     <content ng-controller="contentCtrl">
     // My contextual menu as shown above

Actually, this method is inside another controller (yes, two nested controllers), but the rest of inherited functions work properly; the only one that is not working is this one. Anyways, I keep seeing the normal pointer when I put the mouse on my div/pair of spans, so it's not being applied at all (I can see it in the HTML console tho).

Answer 1

Try altering your ng-controller line:

<body ng-controller="MainCtrl as vm">

Then your method call:

<div ng-click="vm.removeNote()">

Does it work now, does the console.log give you something?

Ng-click not working in div

Question

1 answers

solution1
0 2016-05-14 07:16:31

Ng-click not working in div

Question

1 answers

solution1 0 2016-05-14 07:16:31

solution1
0 2016-05-14 07:16:31