我在我的应用程序中使用了
angular-bootstrap-colorpicker,并且有一个奇怪的问题. colorpicker模块有一个名为Slider的工厂.这导致colorpicker不工作,因为我的应用程序还有一个名为Slider的工厂.在应用程序中重构每一次这样的事情是不可能的,而且看起来似乎是一个马虎的解决方法.抛出的错误是
Uncaught TypeError: Slider.setSaturation is not a function
我已经得出结论是因为我的应用程序的工厂没有方法setSaturation和角度是“困惑”.我对工厂的了解不够了,Angular如何组织他们,但似乎很奇怪,他们可以在这样的模块中使用.例如
angular.module('thomasApp',[]) ... .factory('Slider',...
受到影响
angular.module('colorpicker.module',...
或相反亦然.
有没有什么可以划分这个colorpicker,这样它不会干扰我的Slider工厂?
编辑:
我同意使用前缀作为命名空间的链接答案是一个聪明的想法.然而,这将需要不切实际的重构量.我很欣赏下面的答案,但是对于我来说,这并没有足够的实力.
1)这真的是最好的解决方案(除了从项目开始的前缀)? – 如果我进行这样的改变,下一次我做一个更新的时候会被删除,还是有人拉下我的项目并做一个安全的?
有没有更好的方法? – 如果没有,现在的答案能否扩大,并说明发生了什么呢?
解决方法
您的问题是Angular中的一般已知问题. @fracz是对的,它与
Modules and namespace / name collision in AngularJS连接.问题是Angular每个模块实例只有一个$inject实例,并且所有定义的可注入对象都进入它.通过可注入对象我的意思是常量,值,服务,控制器,指令..这在这种情况下是坏的,因为即使我们通过定义多个模块和它们之间的依赖关系来模块化我们的应用程序,所有定义的注入对象最终都在相同的上下文/命名空间/注射器.
在这种情况下,Angular使用fail-fast技术更加恶化,并且由于应用程序继续工作,您可能会最终注意到这个问题,这往往会导致昂贵的重构.还有一个问题,我们如何能够改善这一点,国际海事组织的失败至少有助于在开始时避免这个问题.
不过在你的情况下,你很幸运,图书馆真的很小,你所需要的只是颜色选择器的指令.我通过在模块中定义颜色选择器指令,从实例化的库模块$inject中定义了解决方案的例子here.像这样,你可以自由地改变它的名字:).
代码示例:
// NOTE: redefine the directive app.directive('colorpicker',function () { var injector = angular.injector(['ng','colorpicker.module']); return injector.get('colorpickerDirective')[0]; });
为了澄清目的,还有一个示例显示了当您定义具有相同名称的两个服务时角度的行为.该应用程序成功地继续使用最后一个服务定义.
我希望这个答案能使事情清晰,并成功地解决你的问题.如果您有更多的问题可以自由询问.干杯!