如何在给定的角度应用程序中获取所有指令名称？答案

【问题标题】：How to get all directive names in a given angular app?如何在给定的角度应用程序中获取所有指令名称？
【发布时间】：2015-04-01 12:39:55
【问题描述】：

假设我有一个 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。

【问题讨论】：

标签： javascript angularjs angularjs-directive

【解决方案1】：

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

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 列表以获取未来知识。

【讨论】：

太好了，谢谢！如果我事先不知道模块名称，是否还有办法找出它们？
我不确定您是否可以在不进行一些调整的情况下获得该列表。看看这个问题，它有一个很好的存储模块的解决方案。 stackoverflow.com/questions/24889783/…
int i=0 无法编译
我的错，int 应该是 var。

【解决方案2】：

解决方案 下面的函数将返回一个模块下的所有指令

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')

将打印 school 指令下的指令 playGround 的定义

【讨论】：