2

AとBの再利用可能なコンポーネントがあるとしましょう。BがAのメソッドを呼び出すようにしたい（もちろん、BがAの子である場合のみ）。また、Bをスタンドアロンコンポーネントとして（Aを親として使用せずに）使用したい。このような場合、存在しないAのメソッドを呼び出さないでください。私の最初の試みは、コントローラーをリンク関数に入れることでした（Bで指定したのとまったく同じ方法で、require: "^A"Bをスタンドアロンコンポーネントとしても使用したいので、コントローラーを使用できません）。ただし、これは機能しません。

var module = angular.module("mymodule", []);

// <A>
module.directive("A", function() {
    return {
        restrict: "E",
        transclude: true,
        replace: true,
        scope: {},
        controller: function($scope, $element, $attrs) {
            this.register = function() {
               console.log("Hooray!");
            };
        },
        template:
            '<div class="ng-a" ng-transclude></div>'
    };
});

// <B>
module.directive("B", function() {
    return {
        restrict: "E",
        transclude: true,
        replace: true,
        scope: {},
        link: function($scope, $element, $attrs, refA) {
            if (refA !== undefined) {
                refA.register();
            } else {
                console.log("Standalone");
            }
        },
        controller: function($scope, $element, $attrs) {
            // Do something.
        },
        template:
            '<div class="ng-b" ng-transclude></div>'
    };
});

ユースケースの場合：

<A><B></B></A><B></B>

コンソール出力は次のようになります。

Hooray!
Standalone

何か案は？ありがとう！

4

1 に答える 1

5

条件付きで、疑問符を前に付ける別のディレクティブを要求できますrequire: "^?A"。次に、コントローラーがnullでないことをテストして、親ディレクティブ内で呼び出されたか、スタンドアロンとして呼び出されたかを確認できます。

于 2013-01-26T16:39:40.153 に答える