AngularJS从控制器中的指令处理事件

时间:2016-09-17 06:11:21

标签: angularjs angular-directive

我有以下AngularJS指令(在底部),如果单击链接 saveClick(),则应显示警告窗口:

<span save-click="alert('hallo ich binssdsd')" data-ng-dropdown-multiselect options="vm.translatedRoles" selected-model="vm.selectedRoles" external-id-prop="label"></span>

但没有任何反应。有谁知道我做错了什么?

directiveModule.directive('ngDropdownMultiselect', ['$filter', '$document', '$compile', '$parse', '$rootScope',
function ($filter, $document, $compile, $parse, $rootScope) {

    return {
        restrict: 'AE',
        scope: {
            selectedModel: '=',
            options: '=',
            extraSettings: '=',
            events: '=',
            searchFilter: '=?',
            translationTexts: '=',
            groupBy: '@',
            saveClick: '&'
        },
        template: function (element, attrs) {
            var checkboxes = attrs.checkboxes ? true : false;
            var groups = attrs.groupBy ? true : false;

            var template = '<div class="multiselect-parent btn-group dropdown-multiselect">';
            template += '<li><a data-ng-click="saveClick()"><span class="glyphicon glyphicon-floppy-disk"></span>  {{texts.save}}</a>';
            ...

1 个答案:

答案 0 :(得分:0)

您需要向指令定义对象添加链接函数才能使警报生效。

以下是示例代码:

<强> directive.js

<div ng-app="myApp">
   <test-alert></test-alert>
</div>

<强>的index.html

        <li class="scroll active"><a href="#home">Home</a></li> // first when page load
        <li class="scroll"><a href="#services">Service</a></li> // second when page is scrolling to down.
        <li class="scroll"><a href="#about-us">About Us</a></li> //..
        <li class="scroll"><a href="#portfolio">Portfolio</a></li>
        <li class="scroll"><a href="#team">Team</a></li>
        <li class="scroll"><a href="#blog">Blog</a></li>
        <li class="scroll"><a href="#contact">Contact</a></li>

WorkingExample