从引导程序覆盖ng-click

时间:2015-03-02 15:25:03

标签: angularjs twitter-bootstrap carousel angular-ui-bootstrap

假设我正在定制一个angularjs bootstrap轮播并将其作为指令。我想自定义ng-click在每个左/右箭头上调用的当前函数,以便在引导程序中定义的原始函数之前调用自定义函数。我知道在ng-click中调用多个函数可以通过

完成
ng-click = "customFunction();originalFunctionFromBootstrap()"

但是,在角度轮播中,左箭头和右箭头在其引导模板中定义,我不想使用$ templatecache修改模板。 有没有办法在我的控制器中添加新的ng-click而不必修改模板缓存?

编辑: 我目前的解决方法是使用

document.querySelector('.left.carousel-control').addEventListener('click', function(){...})

当然,这不是一种有角度的方式。另外,如果我使用ng-touch中的ng-click,也不会调用此方法。有没有办法如何修改ng-click?

2 个答案:

答案 0 :(得分:1)

如果继承了指令的范围,则可以将库函数保存在变量中,并使用逻辑覆盖函数。然后调用保存在变量上的函数,这样一切都能继续工作。

var _superClickMethod = scope.originalFunctionFromBootstrap;
scope.originalFunctionFromBootstrap = function () {
  // custom logic
  _superClickMethod();
}

其他解决方案是将carrusel bootstrap插件包装在你的指令中。我推荐最后一个选项。

答案 1 :(得分:0)

我最终做的是:

document.querySelector('.left.carousel-control').setAttribute('ng-click', 'customFunction()');
$compile(document.querySelector('.left.carousel-control'))(scope);

这解决了我的问题。