ng-click funktioniert nicht innerhalb der Direktive

Question

Dies ist die Direktive mit der Funktion, die beim Klicken aufgerufen werden soll.

ebApp.directive('monthDir', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'htmlFiles/monthDirective.html', 
     transclude: true, 
     scope: { 
      ebObj: "=obj" 
     }, 
     link: function link(scope, element, attrs, ngModelCtrl) { 
      scope.removeDir = function (removeVal) { 
       console.log("asd"); //not showing in the console 

      } 
      console.log(scope); 
     }, 
     controller: function ($scope) { 

     } 
    } 
}) 

Der ng-Klick in der folgenden Direktive funktioniert nicht. Die in der Richtlinie html

<div class="row monthDirC"> 
    <span class="glyphicon glyphicon-remove-sign pull-right cursorC" 
    ng-click="removeDir(ebObj.costArray[count])" ></span> 

    <div class="form-group"> 
     <label for="datepick" class="col-md-6">Select month</label> 
     <md-datepicker id="datepick" class="col-md-6" ng-model="ebObj.costArray[count].myDate" 
         md-placeholder="Enter date" 
         md-min-date="minDate" 
         md-max-date="maxDate"> 

     </md-datepicker> 
    </div> 

Der HTML-Code, die Richtlinie verwendet:

<div class="col-md-12"> 
     <month-dir ng-transclude ng-repeat="count in ebObj.costArray[0].countArray" obj="ebObj.costArray[count+1]"></month-dir> 
</div> 

Answer 1

Es ist richtig funktioniert. Stellen Sie sicher, dass Sie keine Fehler haben. Versuchen Sie dieses,

var ebApp = angular.module('ebApp', []); 
 

 
ebApp.controller('MainCtrl', function($scope) { 
 
    $scope.ebObj = 'someVal'; 
 
}); 
 

 
ebApp.directive('monthDir', function() { 
 
    return { 
 
     restrict: 'E', 
 
     template: '<div ng-click="removeDir()"><b>Click Me</b><ng-transclude></ng-transclude></div>', 
 
     transclude: true, 
 
     scope: { 
 
      ebObj: '=obj' 
 
     }, 
 
     link: function link(scope, element, attrs, ngModelCtrl) { 
 
      scope.removeDir = function (removeVal) { 
 
       console.log('asd'); //not showing in the console 
 
      } 
 
     }, 
 
     controller: function ($scope) { 
 

 
     } 
 
    } 
 
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script> 
 

 
<div ng-app="ebApp" ng-controller="MainCtrl"> 
 
    <month-dir ebObj="ebObj"><i>Click Me!</i></month-dir> 
 
</div>