禁用特定范围的角度指令?

时间:2015-12-11 03:59:16

标签: jquery angularjs angular-translate

我们正在使用第三方库angular translate,其指令名称为data-translate。但是我们的合作伙伴有一个js文件注入到我们的页面,他们使用jquery找到相同的指令“data-translate”然后翻译元素。因此每次角度转换都会覆盖它。

样品:

<script src="angular-translate">//it will search data-translate and make the translate by it's key</script>
<script src="jquery-translate">//it will search data-translate and make the translate by it's key</script>
<header data-translate="headerKey"></header>
<div data-translate="translateKey"></div>
<footer data-translate="footerKey"></footer>

最后这将是

<header data-translate="headerKey">angular-translate</header>
<div data-translate="translateKey">angular-translate</div>
<footer data-translate="footerKey">angular-translate</footer>

但我需要的是:

<header data-translate="headerKey">angular-translate</header>
<div data-translate="translateKey">jquery-translate</div>
<footer data-translate="footerKey">angular-translate</footer>

所以我想询问是否可以在特定范围内禁用角度指令?

1 个答案:

答案 0 :(得分:1)

通过在angular-translate指令链接函数上添加代码,我找到了解决这个问题的方法:

if($scope.disableTranslate){return;}

为disableTranslate添加我自己的指令:

app.directive('disableTranslate', [function() {
      return {
        restrict: 'A',
        controller: ['$scope', function($scope) {
          $scope.disableTranslate = true;
        },],
      };
    },])

这样我就可以使用disable-translate指令宣布元素的范围不是由angular-translate翻译而是jquery-translate。