修复两个具有相同名称的AngularJS指令的最佳方法是什么？

Question

I have a project that's getting quite large. 我有一个项目变得非常庞大。 My problem is with clashing 3rd party directives because of... unwisely... chosen directive names, ie "datepicker." 我的问题是因为......不明智的......选择的指令名称，即“datepicker”，因此会发生冲突的第三方指令。

Since I use bower for dependency management, I don't want to edit any of the libraries because that would break portability. 由于我使用bower进行依赖关系管理，我不想编辑任何库，因为这会破坏可移植性。

How has anyone solved this issue? 怎么有人解决了这个问题？

Answer 1

After my comment, I created a plunker to see if this workaround is viable and to see how Angular behaves in the case of name clashing but under different modules: 在我的评论之后，我创建了一个plunker，看看这个解决方法是否可行，并看看Angular在名称冲突但在不同模块下的行为：

http://plnkr.co/edit/9JKTEfGG4bu47QQIEhBh?p=preview http://plnkr.co/edit/9JKTEfGG4bu47QQIEhBh?p=preview

It seems that if you use different restrictions for different directives then it does work (you need to use the ones that are not mutual on the different directives). 似乎如果对不同的指令使用不同的限制，那么它确实有效（你需要使用不同指令上不相互的指令）。

<!DOCTYPE html>
<html>

  <head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
  </head>

  <body ng-app="myApp" ng-controller="myCtrl as vm">

  <div some-directive></div>
  <some-directive></some-directive>

  <script>
    var myApp2 = angular.module('myApp2',[]);
    myApp2.directive("someDirective", function() {
      return {
        restrict: 'E',
        template: 'inside myApp2'
      };
    });

    var myApp = angular.module('myApp', ['myApp2']);
    myApp.directive("someDirective", function() {
      return {
        restrict: 'A',
        template: 'inside myApp'
      };
    });


  </script>
  </body>

</html>

OUTPUT OUTPUT

inside myApp
inside myApp2

修复两个具有相同名称的AngularJS指令的最佳方法是什么？

问题描述

1 个解决方案

解决方案1
2 已采纳 2015-08-10 23:06:46

修复两个具有相同名称的AngularJS指令的最佳方法是什么？

问题描述

1 个解决方案

解决方案1 2 已采纳 2015-08-10 23:06:46

解决方案1
2 已采纳 2015-08-10 23:06:46