【问题标题】:Check if an Angular directive exists检查是否存在 Angular 指令
【发布时间】:2016-10-12 14:44:38
【问题描述】:

在我们的 Angular 项目中,我们围绕动态指令做了大量工作,其中一个不错的方法是拥有一个可以列出许多不同类型的相似对象的通用指令(例如,消息、用户、cmets 等),通过根据对象的类型委托给特定的指令。

我们将此指令称为object-list,如果我们能够使其正常工作,它有望委托给许多不同的指令。

我们需要解决的主要问题是我们的系统中是否存在已提供此object-list 指令的指令。我们一直在检查这一点的方法是针对目标指令发出$compile,将其链接到范围,并检查其 HTML 内容(例如,var tmpElement = $compile('<div my-message'></div>')(scope);)。当 template 选项引用目标指令的模板时,这似乎有效,但是当我们尝试指向 templateUrl 时,HTML 内容为空。

这是一个 Plunker,使用了 templateUrl 方法(不起作用)。您可以将其注释掉并取消注释 template 行以查看警报显示。

http://plnkr.co/edit/wD4ZspbGSo68v4eRViTp

还有其他方法可以检查指令的存在吗?我承认,这确实有点像 hack。

【问题讨论】:

    标签: javascript angularjs


    【解决方案1】:

    您可以使用$injector.has 来检查提供者或实例是否存在。

    app.directive('objectList', function ($compile, $injector) {
      return {
        template: 'OK',
        link: function (scope, element, attrs) {
          var exist = $injector.has('myMessageDirective');
          ...
        }
      };
    });
    

    【讨论】:

    • 感谢您的回复,布欧。不幸的是,它看起来不像这样有效。 $injector.has() 方法的文档指出它仅用于服务查找。此外,在我的 Plunker 上尝试(在此处更新 plnkr.co/edit/owHeruUXmfxFSE1klv7S)无法给我想要的结果。
    • 应该是$injector.has('myMessageDirective'),而不是$injector.has('myMessage')。 (为什么?因为 $compile 服务在注册任何指令时都会添加“指令”后缀。)工作 plunker:plnkr.co/edit/n1XX6cgvZ4o6eVGhj4aO?p=preview
    • 啊,我现在明白了。谢谢,布欧!
    • 你也可以用它来检查组件是否存在(Angular 1.5+)。
    猜你喜欢
    • 2021-06-30
    • 1970-01-01
    • 2012-06-10
    • 2014-11-26
    • 1970-01-01
    • 1970-01-01
    • 2015-04-07
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多