ng-单击指令不起作用

ng-click in directive not working

本文关键字：不起作用 指令 单击 ng-      更新时间：2023-09-26

卡片抽屉.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>
尝试在

div中ng-click，而不是ngClick调用fn。

相关文章：