1. ホーム
  2. angularjs

[解決済み] ページ内のウォッチ数をカウントするには?

2022-05-11 13:59:58

質問

JavaScriptで、ページ全体のangular watchの数をカウントする方法はありますか?

私たちは バタラン を使用していますが、それは私たちのニーズに必ずしも合っていません。 私たちのアプリケーションは大きいので、自動テストを使ってウォッチカウントが上がりすぎていないかチェックすることに興味があります。

また、コントローラ単位でウォッチ数をカウントすることも有用でしょう。

編集 : これが私の試みです。 ng-scopeクラスですべての時計をカウントしています。

(function () {
    var elts = document.getElementsByClassName('ng-scope');
    var watches = [];
    var visited_ids = {};
    for (var i=0; i < elts.length; i++) {
       var scope = angular.element(elts[i]).scope();
       if (scope.$id in visited_ids) 
         continue;
       visited_ids[scope.$id] = true;
       watches.push.apply(watches, scope.$$watchers);
    }
    return watches.length;
})();

どのように解決するのですか?

(を変更する必要があるかもしれません。 bodyhtml を配置した場所、または ng-app )

(function () { 
    var root = angular.element(document.getElementsByTagName('body'));

    var watchers = [];

    var f = function (element) {
        angular.forEach(['$scope', '$isolateScope'], function (scopeProperty) { 
            if (element.data() && element.data().hasOwnProperty(scopeProperty)) {
                angular.forEach(element.data()[scopeProperty].$$watchers, function (watcher) {
                    watchers.push(watcher);
                });
            }
        });

        angular.forEach(element.children(), function (childElement) {
            f(angular.element(childElement));
        });
    };

    f(root);

    // Remove duplicate watchers
    var watchersWithoutDuplicates = [];
    angular.forEach(watchers, function(item) {
        if(watchersWithoutDuplicates.indexOf(item) < 0) {
             watchersWithoutDuplicates.push(item);
        }
    });

    console.log(watchersWithoutDuplicates.length);
})();

  • erilem さんのご指摘により、この回答には $isolateScope の検索とウォッチャーが重複している可能性があることを、彼の回答/コメントで指摘していただき、ありがとうございます。

  • Ben2307の指摘に感謝します。 'body' を変更する必要があるかもしれません。


オリジナル

私はそのクラスではなく、HTML要素のデータ属性をチェックしたことを除いて、同じことをしました。 私はここであなたのを実行しました。

http://fluid.ie/

で、83点。 私のも走らせて121点でした

(function () { 
    var root = $(document.getElementsByTagName('body'));
    var watchers = [];

    var f = function (element) {
        if (element.data().hasOwnProperty('$scope')) {
            angular.forEach(element.data().$scope.$$watchers, function (watcher) {
                watchers.push(watcher);
            });
        }

        angular.forEach(element.children(), function (childElement) {
            f($(childElement));
        });
    };

    f(root);

    console.log(watchers.length);
})();

私もこれを入れました。

for (var i = 0; i < watchers.length; i++) {
    for (var j = 0; j < watchers.length; j++) {
        if (i !== j && watchers[i] === watchers[j]) {
            console.log('here');
        }
    }
}

しかし、私のはソリューションセットの適切なサブセットではないことを確実に知るための深いangularの知識が不足しています。