0

modeディレクティブに渡す属性に基づいて、異なるルート要素が必要なディレクティブを作成しています。以下は、想定されるテンプレート ファイルです。

テンプレートファイル:

<div ng-if="mode === 'full'">
    <div>
        ...
    </div>
    <input (a lot of attributes...)
           class="datepicker" />
</div>

<input ng-if="mode === 'short'"
       (a lot of attributes...)
       class="datepicker" />

しかしもちろん、AngularJS は、テンプレートに 1 つのルート要素が必要であると不平を言っています。

templateUrlそれらを2つのファイルに分割し、条件付きで(つまり)ロードできることを知っていますtemplateUrl: function(tElem, tAttrs) { if tAttrs.mode === 'full' ...

しかし、私の状況では、モードとモード<input class="datepicker" />の両方で同じである多くの異なる属性を持つ要素があります。理想的には別のディレクティブに入れたいのですが、私の場合はやり過ぎだと思います。次に、両方の結果を 2 つの異なるテンプレートに保持すると、共有情報 (属性) が 2 つの別個のファイルに分離されます。モードで何かを変更する人は、モードで同じ変更を行うことを覚えておく必要があります。これは別のファイルに存在します。fullshortinputinputinputshortinputfull

質問: 単一のテンプレート ファイル内でこのような状況を処理するにはどうすればよいですか?

注意: この場合、単一のラッピング要素 (例: ) を追加することはできません<div>。これは私が持っているレイアウトに違反します。

4

0 に答える 0