如何在给定的angular应用程序中获取所有指令名称

How to get all directive names in a given angular app?

本文关键字：获取 指令 应用程序 angular      更新时间：2023-09-26

假设我有一个angular应用程序，它有一些模块和一些指令
我想获取此应用程序中所有已定义指令的列表。

例如：

var myModule = angular.module('myModule', [function(){...}]);
myModule.directive('myDirective', [function () {...}]);
myModule.directive('myOtherDirective', [function () {...}]);
var myOtherModule = angular.module('myOtherModule', [function(){...}]);
myOtherModule.directive('thirdDirective', [function () {...}]);

我想写一个函数getAllDirectives()，它将返回['myDirective','myOtherDirective','thirdDirective']

如果可能的话，我也想知道每个指令属于哪个模块：

{
    'myModule': ['myDirective','myOtherDirective'],
    'myOtherModule':['thirdDirective']
}

如何做到这一点
请注意，我需要在应用程序本身之外以及加载后进行此操作。我确实可以访问页面上公开的任何内容，例如angular对象和DOM。

您可以使用如下自定义函数获取每个模块中定义的所有指令：

function get_directives(name) {
    var result  = [],
        invokes = angular.module(name)._invokeQueue;
    for(var i=0; i<invokes.length; ++i) {
        if(invokes[i][1] == "directive") {
            result.push(invokes[i][2][0]);
        }
    }
    return result;
}
var result = {
    'myModule':      get_directives('myModule'),
    'myOtherModule': get_directives('myOtherModule'),
};

您还可以查看angular.module('module_name')._invokeQueue列表以了解未来的知识。

解决方案以下功能将返回模块下的所有指令

function getAllDirectives(moduleName) {
    var directives = [];
    var invokes = angular.module(moduleName)._invokeQueue;
    for (var i in invokes) {
        if (invokes[i][1] === "directive") directives.push(invokes[i][2]);
    }
    return directives;
}

getAllDirectives('school') //'school' is module name

附加

如果您想要模块的指令定义

var getDirectiveDef = function(dirName, appName){
     dirName = converToCamelCase(dirName);//converting dirname to camelCase if it has hyphen
     var allDirs = getAllDirectives(appName) //the above mentioned functoin
     _.each(allDirs, function(directive){
         if(directive[0] == dirName){
             console.log(directive);
         }
     })
}
function getAllDirectives(moduleName) {
        var directives = [];
        var invokes = angular.module(moduleName)._invokeQueue;
        for (var i in invokes) {
            if (invokes[i][1] === "directive") directives.push(invokes[i][2]);
        }
        return directives;
    }
//used to convert incase if the directive name is not in camelCase input
function converToCamelCase (string) {
    return string.replace( /-([a-z])/ig, function( all, letter ) {
        return letter.toUpperCase();
    });
}

示例

getDirectiveDef('play-ground', 'school')
[or]
getDirectiveDef('playGround', 'school')

将在学校目录

下打印指令操场的定义
相关文章：