延伸的角指令 [英] Extending Angular Directive

问题描述

我想稍作修改第三方指令（具体角UI引导）。我只是要添加到的范围窗格指令：

I'd like to make a minor modification to a 3rd party directive (specifically Angular UI Bootstrap). I simply want to add to the scope of the pane directive:

angular.module('ui.bootstrap.tabs', [])
.controller('TabsController', ['$scope', '$element', function($scope, $element) {
  // various methods
}])
.directive('tabs', function() {
  return {
    // etc...
  };
})
.directive('pane', ['$parse', function($parse) {
  return {
    require: '^tabs',
    restrict: 'EA',
    transclude: true,
    scope:{
      heading:'@',
      disabled:'@' // <- ADDED SCOPE PROPERTY HERE
    },
    link: function(scope, element, attrs, tabsCtrl) {
      // link function
    },
    templateUrl: 'template/tabs/pane.html',
    replace: true
  };
}]);

但我也想保持角度，引导最新与鲍尔。当我运行亭子更新，我将覆盖我的变化。

所以，我怎么去从这个鲍尔单独组件扩展该指令？

So how do I go about extending this directive separately from this bower component?

推荐答案

大概要解决这个最简单的方法是建立在你的应用程序指令具有相同的名称作为第三方指令。这两个指令将运行，并且可以指定使用优先级属性的运行顺序（更高的优先级运行）。

Probably the simplest way to solve this is to create a directive on your app with the same name as the third party directive. Both directives will run and you can specify their run order using the priority property (higher priority runs first).

两项指令将共享范围，您可以访问并通过您的指令的链接方法。

The two directives will share scope and you can access and modify the scope of the third party directive via your directive's link method.

选项2：您还可以通过简单地把自己的任意命名的指令在相同的元素用它访问第三方指令的范围（假定没有指令使用隔离范围）。的元素上的所有非隔离范围，指令将分享范围。的

Option 2: You can also access a third party directive's scope by simply putting your own arbitrarily named directive on the same element with it (assuming neither directive uses isolate scope). All non-isolate scope directives on an element will share scope.

延伸阅读： https://github.com/angular/angular.js/wiki/Understanding-Directives#extending-directives

注意：我的previous答案是修改第三方服务，而不是一个指令

Note: My previous answer was for modifying a third party service, not a directive.

这篇关于延伸的角指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！