ng-click in指令不起作用

Question

card-drawer.html（模板）

<div class="card-drawer-wrapper">
<div class="card-drawer-icon" ngClick="cdCtrl.toggle()">
    <i class="icon--{{ icon }}"/>
</div>
<div class="{{'card-drawer ' + (classesToAdd || '' )}}">
    <ng-transclude></ng-transclude>
</div>

cardDrawer.ts（指令和控制器）

declare var _:UnderscoreStatic;

class CardDrawerController {
static $inject = [];

toggle() {
    alert('toggled');
}
}

CardDrawerDirective.$inject = [];

export interface ICardDrawerScope {
icon: string
classesToAdd: string
}

export interface ICardDrawerAttributes extends ng.IAttributes {
icon: string
'classes-to-add': string
}

export function CardDrawerDirective():ng.IDirective {
return {
    restrict: 'A',
    templateUrl: 'card-drawer.html',
    controller: CardDrawerController,
    controllerAs: 'cdCtrl',
    scope: true,
    replace: true,
    transclude: true,
    link(scope:ICardDrawerScope, element:ng.IAugmentedJQuery, attrs:ICardDrawerAttributes, controller:CardDrawerController) {
        scope.icon = attrs.icon || 'pencil';
    }
};
}

html（这就是我想要的方式。）

<div card-drawer>
        Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet
        risus. Sed posuere consectetur est at lobortis. Lorem ipsum dolor sit amet, consectetur adipiscing elit.
        Nullam quis risus eget urna mollis ornare vel eu leo. Nullam id dolor id nibh ultricies vehicula ut id elit.
        Donec sed odio dui. Nullam id dolor id nibh ultricies vehicula ut id elit.                      
</div>

Answer 1

在div中尝试field :tag do inline_add false inline_edit false end ，而不是ng-click来调用你的fn。