Question

我有使用隔离范围的简单指令：

app.directive('reportsLegend', [
    function() {
        return {
            restrict: 'EA',
            replace: false,
            scope: {
                label: '@'
            },
            template: '<div  style=" margin-top: 60px;">'+    
                      '   <div class="row" style="direction: rtl;">'+  
                      '       <legend>{{label}}</legend>'+                      
                      '   </div>'+
                      '<div class="row">'+ 
                      '<button class="btn" ><i  ng-click="getCSV()"></i>CSV</button>'+
                      '<button class="btn" ><i  ng-click="extendInNewTab()"></i>new window</button>'+
                      '<li><a href ng-click="getCSV()">zzzz</li>'+
                      '   </div>'+
                      '</div>',
                     link: function(scope, elem, attrs, ctrl) { 
                     console.log(elem);    

                scope.getCSV = function(){
                    alert('getCSV');
                };
                scope.extendInNewTab = function(){
                    alert('extendInNewTab');
                };
            }
        }
    }]);

但是，ng-click两个按钮不会触发，但href ng-click="getCSV()">可以正常工作。

如何让ng-click用于按钮？

我是否需要使用$compile或$watch或我错过了什么？

这是Demo

谢谢，

Answer 1

ng-click无法与<i>一起使用，因为您的<i>内没有任何内容，请尝试将其移至<button>

'<button class="btn" ng-click="getCSV()"><i class="fa fa-download fa-1"></i>CSV</button>'+
'<button class="btn" ng-click="extendInNewTab()"><i class="fa fa-download fa-1" ></i>new window</button>'

DEMO

或将文字移至<i>内：

'<button class="btn"><i class="fa fa-download fa-1" ng-click="getCSV()">CSV</i></button>'+
 '<button class="btn" ><i class="fa fa-download fa-1" ng-click="extendInNewTab()">new window</i></button>'

DEMO

Answer 2

使用按钮绑定ng-click，因为<i>没有内容。因此它没有解雇

'<button class="btn"  ng-click="getCSV()"><i class="fa fa-download fa-1"></i>CSV</button>'+
'<button class="btn"  ng-click="extendInNewTab()"><i class="fa fa-download fa-1"></i>new window</button>'+

DEMO

为什么ng Click在指令隔离范围内不起作用？

2 个答案: