AngularJS $ rootScope。$ emit不会触发方法

时间:2016-01-10 12:01:22

标签: javascript angularjs angularjs-directive

我想根据需求使用服务触发指令。以下是指令代码。

var app = angular.module('MyModule').service('DOMService', ['$rootScope', function ($rootScope) {
    this.Manipulate = function () {
        $rootScope.$emit('manipulateDOM');
    };
}]).directive('domDirective', ['$rootScope', function ($rootScope) {
    return {
        restrict: 'EA',
        replace: 'false',
        scope: true,
        link: function (scope, elm, attrs) {
            $rootScope.$on("manipulateDOM", function () {
                alert("Entered......");
                //  element.find('#DirectiveLable').css('background-color', 'red')
                // element.find('#DirectiveLable').css('height', '100')
            });
        },
    };
}]);

我的HTML如下

<div id="example">
        <div id="grid"></div>
        <dom-directive>
            <label id="DirectiveLable">Click Here</label>
        </dom-directive>
    </div>

我在Angular Controller中调用下面的服务

angular.module('MyModule').controller('CitizenRelationAccordionController', ['$scope', '$q', '$attrs', 'DOMService',
    function ($scope, $q, $attrs, DOMService) {
       DOMService.Manipulate();
    }
 ]);

问题是,尽管DOMService正在触发,但它没有调用警报写入的指令方法

1 个答案:

答案 0 :(得分:0)

我认为你错过了模块声明中的[]here是你所写内容的一个有效例子。

希望这可以提供帮助,

的Dario