角度指令窗口事件侦听器

Question

我是 angularJS 的新手，并不完全了解事件侦听器和内存混乱。那么当我有一个用于多个元素的指令时会发生什么，那就是设置窗口调整大小事件侦听器。当在 20 个元素上设置此指令时，窗口事件是：

1. 设置20次

2. 设置一次，因为函数 allready excists。

3. 设置多少次，只要不发生一百万次。。。。。

恐怕会占用大量内存，我可能想根据窗口视口使用它来更改图像 src。

angular.module('log').directive(
    "log",['$window', '$http', function($window, $http) {
        return ({
            link: function link( $scope, element, attributes ) {
                var logFunc = function logFunc() {
                    console.log(
                          'I want to change the src attribute,'
                        + ' depending on viewport, by using'
                        + ' element.src = attributes.src1024'
                    );
                };
                angular.element($window).bind('resize', logFunc);
            }
        });
    }]
);
<img src="" log data-src1024="img/1024/some-image.jpg" />
<img src="" log data-src1024="img/1024/some-image.jpg" />
<img src="" log data-src1024="img/1024/some-image.jpg" />
<img src="" log data-src1024="img/1024/some-image.jpg" />

Answer 1

https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

多个相同的事件侦听器

如果在同一事件

目标上注册了多个具有相同参数的相同事件侦听器，则会丢弃重复的实例。它们不会导致事件侦听器被调用两次，并且由于重复项被丢弃，因此不需要使用 removeEventListener 方法手动删除它们。