2017-07-17 101 views
0

這是帶有應該在單擊時調用的函數的指令。ng-click在指令中不起作用

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) { 

     } 
    } 
}) 

下面的指令中的ng-click不起作用。該指令的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> 

使用該指令的HTML:

<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> 
+0

嘗試在除去功能名稱鏈接:功能鏈路(範圍,元件,ATTRS,ngModelCtrl){ - >鏈接:功能(範圍,元件,ATTRS,ngModelCtrl){ –

+0

@WasifKhan。試過了。沒有工作。 – Abhi

回答

1

它是否正常工作。確保你沒有任何錯誤。嘗試此,

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>

+0

我的模板和指令有什麼不對。當我使用templateurl時它不起作用 – Abhi

+0

我在指令的輸入字段中添加了$ watch。那沒有工作 – Abhi

+0

我編輯了答案中的代碼。嘗試從html中刪除'ng-transclude',並將其放在模板 –