114

サードパーティのディレクティブ (具体的にはAngular UI Bootstrap )を少し変更したいと思います。paneディレクティブのスコープに追加したいだけです。

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
  };
}]);

しかし、Angular-Bootstrap を Bower と合わせて最新の状態に保ちたいとも思っています。を実行するとすぐにbower update、変更を上書きします。

では、このディレクティブをこの bower コンポーネントとは別に拡張するにはどうすればよいでしょうか?

4

5 に答える 5

60

TL;DR - デモをお願いします!


     Big Demo Button     
 

サードパーティの指示を装飾するには、 を使用し$provideます。decorator()

この場合、次のようにディレクティブのスコープを拡張できます。

app.config(function($provide) {
    $provide.decorator('paneDirective', function($delegate) {
        var directive = $delegate[0];
        angular.extend(directive.scope, {
            disabled:'@'
        });
        return $delegate;
    });
});

pane最初に、最初の引数として連結された名前を渡してディレクティブを装飾するように要求しDirective、次にコールバック パラメーター (その名前に一致するディレクティブの配列) からそれを取得します。

取得したら、そのスコープ オブジェクトを取得し、必要に応じて拡張できます。これはすべてconfigブロック内で行う必要があることに注意してください。

いくつかのメモ

  • 同じ名前のディレクティブを単純に追加してから、その優先レベルを設定することをお勧めします。非意味的であることは別として (これは言葉でさえありませんが、私は知っています...)、問題を引き起こします。

  • JeetendraChauhan は、このソリューションはバージョン 1.13 では機能しないと主張しています (私はまだテストしていません)。

于 2014-02-22T16:04:30.233 に答える
8

これはあなたの質問に対する直接的な回答ではありませんが、http://angular-ui.github.io/bootstrap/の最新バージョン (マスター) がタブを無効にするためのサポートを追加したことを知りたいと思うかもしれません。この機能は次の方法で追加されました: https://github.com/angular-ui/bootstrap/commit/2b78dd16abd7e09846fa484331b5c35ece6619a2

于 2013-06-09T10:24:53.550 に答える
1

プロパティを持つディレクティブにバインドを拡張する別のシナリオの別のソリューションbindToControllerを次に示します。

注:これは、ここで提供された他のソリューションに代わるものではありません。元のディレクティブが で設定された特定のケース (他の回答ではカバーされていません) のみを解決しbindToControllerます。

于 2016-09-15T13:00:01.160 に答える