Question

我在Angular中使用typescirpt。

我创建了一个指令，它只是一个包含文本的div和一个类名为“block-close”的关闭按钮

我需要在关闭按钮上添加一个点击功能。

如何将click事件添加到指令内的按钮。

我尝试过像

这样的事情

    angular.element('.block-close').on('click', function(){
        alert('here');
    });

    angular.element(document).find('.block-close').on('click', function(){
        alert('here');
    });

    (()=>{

        class MyDirective implements ng.IDirective{

            public restrict = 'E';
            public scope = {};
            public controller = 'MyController';
            public controllerAs = 'myCtrl';
            public bindToController = true;
            public templateUrl = "mysite.html";

            constructor(){

            }

            link = (scope, element, attrs) => {
                angular.element('.block-close').on('click', function(){
                    alert('here');
                });
            };

        }

        angular.module('myMod').directive('myDirective', ()=> new MyDirective());

    })();

Answer 1

我只是假设你的“mysite.html”有这样的代码

<div>
<input type="button" value="close" class="block-close"/>
</div>

您想要处理点击事件，添加按钮的类别为“阻止关闭”。

实际上在链接函数内部，您可以访问该指令的范围，因此只需添加一个如下所示的函数，

link = (scope, element, attrs) => {
                scope.closeClicked = () =>{
                           alert("clicked..");
                     }
            };

并更新您的“mysite.html”，如下所示

<div>
    <input type="button" value="close" ng-click="closeClicked()" class="block-close"/>
</div>

Angular typescript指令，在元素链接中找到div

1 个答案: