Question

我是AngularJs的新手，我想知道如何在指令链接中使用广播，请看看，谢谢，

这是我的指示，

myApp.directive("displayArticleDivDirective", function($parse,$rootScope) {
        return {
            scope: {
              id: "=",
              status: "@"
            },
            link: function($scope, $element, $attrs) {

                var clickingCallback = function() {
                var id = $scope.id;
                var status = $scope.status;

                    console.log(id); /* id is displayed */

                    $scope.$broadcast("ScopeDisplayArticleDiv",{ id: id , article_status: status}); /* this does not execute, nothing happens here */

              };
              $element.bind('click', clickingCallback);
            }
        };
    });

这是我的听众.$on

$scope.$on("ScopeDisplayArticleDiv", function(event,target){
            /* Nothing Happens Here */
                console.log('test'); 
});

ScopeDisplayArticleDiv不会广播，它不会开火，我的控制台上没有错误。我不知道为什么不开火，一份工作样本将受到高度赞赏，谢谢！

Answer 1

尝试将$ broadcast更改为$ emit。

它们的功能非常相似，但是$ broadcast在范围层次结构中发送消息，而$ emit向上发送消息。假设你的监听器在你的控制器上，或者至少在指令的范围之上，那应该可以解决问题。

这里有更多信息： http://www.binaryintellect.net/articles/5d8be0b6-e294-457e-82b0-ba7cc10cae0e.aspx

来自该链接的照片描绘了我所描述的内容： http://www.dotnettricks.com/img/angularjs/emit-broadcast.png

编辑：或者，您可以将回调函数传递给每次处理单击处理程序时将调用的指令。

myApp.directive("displayArticleDivDirective", function($parse,$rootScope) {
    return {
        scope: {
          id: "=",
          status: "@",
          callbackFn: "&?"
        },
        link: function($scope, $element, $attrs) {

            var clickHandler = function() {
                var id = $scope.id;
                var status = $scope.status;
                if(callbackFn){
                    callbackFn({ id: id , article_status: status});
                }

                console.log(id); /* id is displayed */
          };

          $element.bind('click', clickHandler);
        }
    };
});

$scope.someFunction = function(status)
    //status is passed from inside the directive and this function is run
    //from the parent scope, not the directive scope.
    console.log('test'); 
});

<display-article-div-directive id={{article.id}} status={{article.status}} callback-fn={{someFunction}}></display-article-div-directive>

这将允许在处理单击时将可选回调传递给要触发的指令。此外，您可能想要使用“＆lt;”绑定id时，因为“=”表示您可能会更改从父控制器注册到指令的id。我不知道这是不是你的意图，但我认为id会在指令实例的整个生命周期中不变。

AngularJS如何使用$ scope。$在Directive Link中广播

1 个答案: