2

アンカー要素を div 要素に置き換えるディレクティブを実装しようとしていますが、特定の場合のみです。アンカー要素のコンテンツは置き換えるべきではありませんが、新しい要素に含める必要があります。

アンカー要素は、値が式であり、置換する必要があるかどうかを確認するために評価する必要がある属性を持つことができるという考えです。

fooBar が true の場合:

<a ys-deactivate-anchor="{{ fooBar == true }}"><span>Hallo</span></a>

なるべき

<div ys-deactivate-anchor="{{ fooBar == true }}"><span>Hallo</span></div> 

私のディレクティブは現在次のようになっています。

commonModule.directive('ysDeactivateAnchor', function () {
    return{
        restrict: 'A',
        scope: false,
        replace: true,
        template: function (elme, attrs) {
            return "<div ng-transclude></div>";
        },
        transclude: true
    };
});

置換は期待どおりに機能します。式が true の場合にのみ要素を置換する方法を探しています。現在、自分で交換全体を行う以外に、これを行う方法がわかりません。テンプレート関数を使用して属性をチェックしようとしました。問題は、式を評価するために使用できるスコープがまだないため、テンプレート関数では静的な値しか取得できないことです。

もちろん、置換とトランスクルージョンをスキップして、リンク機能で自分で置換することもできますが、どうにかしてこれを回避できないでしょうか。

4

1 に答える 1

0

このディレクティブを使用してclass、条件付きでクラスをアクティブにします。

何かのようなもの:

<a ng-class="{ 'ysDeactivateAnchor' : fooBar, '':! fooBar}"><span>Hallo</span></a>

ディレクティブの場合:restrict: 'C'

于 2013-10-31T09:27:15.750 に答える