Question

我有一个场景，我必须对本地存储以及控制器的其他数据进行一些更改，这种逻辑应该在整个页面上的任何位置单击即可完成。如果单击是在身体的任何位置进行的，而不是在颜色选择器的按钮上进行的，则该代码应该关闭所有颜色选择器，但是如果单击颜色选择器的按钮，则关闭所有其他颜色选择器，并仅打开相应的一个。首先，我尝试使用ng-click可以正常工作，但是关闭所有颜色选择器和打开各个颜色选择器的速度非常慢。

请注意，我尝试使用$scope.$apply();，但此操作不起作用，但开始出现错误，提示我已进行angularjs消化。然后，我使用了$window.onclick，它工作得非常好，并且色标关闭和打开的速度也非常好。我想知道为什么$window.onclick比ng-click更好。该功能如下

$window.onclick = function (e) {
        var labels = getAllLabels(vm.allData);
        if (!e.target.classList.contains('color-picker-button') || e.target.classList.contains('color-picker-popup') || e.target.classList.contains('buttons-popup-charts')) {
            for (var i = 0; i < labels.length; i++) {
                labels[i].isOpen = false;
                localStorageService.set(labels[i].name + '-isOpen-alpha', false);
            }
            init();
        }
        if (e.target.classList.contains('legends-charts')) {
            var id = e.target.id;
            for (var i = 0; i < labels.length; i++) {
                if (labels[i].name === id) {
                    labels[i].isOpen = !labels[i].isOpen;
                } else {
                    labels[i].isOpen = false;
                }
                localStorageService.set(labels[i].name + '-isOpen-alpha', labels[i].isOpen);
            }
            init();
        }
    };

Answer 1

$window是对浏览器window对象的引用。（有关详细信息，请参见此处：https://docs.angularjs.org/api/ng/service/$window）

ng-click导致通过$scope.$apply的摘要循环。（详细信息：https://docs.angularjs.org/guide/scope）

angularjs $ window.onclick的性能优于ng-click

1 个答案: