2011-04-07 16 views
5

をテンプレートで/他のCSSクラスを指定する場合は簡潔に表現するためにどのように、私は例えば、特定の「条件」に基づき、DIVにCSSクラスを追加したい:DjangoはDjangoテンプレートで

<div class="pkg-buildinfo 
      {% if v.release.version == pkg.b.release.version %}active{% else %}inactive{% endif %} 
      {% if v.release.version == project.latest.version %}latest{% else %}notlatest{% endif %}"> 

vはループ変数であることをノート;全体のものはforループ内で)

上記2つの条件に基づいてCSSクラス「アクティブ」または「非アクティブ」と「最新」または「notlatest」を追加します。

しかしこれは読みにくく、冗長です。私はwith statementが(複雑な変数とは対照的に)同情である式/条件の値の割り当てをサポートしていないことを発見しました。これを行うより良い方法はありますか?

+0

@jammon - 編集のためのおかげで、しかし - 複数行の文字列がHTMLでサポートされている属性値をしていますか? –

+0

ああ、良い点!私はそれを見なければならない。 – jammon

答えて

5

あなたは次にあなたが唯一のテンプレートで属性にアクセスする必要がある代わりに、あなたのビューにそのロジックを入れて、「アクティブ」または「非アクティブ」ですオブジェクトなどの属性を作成することができます。

3

あなたが文を使用してことによってそれを少し短くすることができます。

{% with v.release.version as version %} 
<div class="pkg-buildinfo 
      {% if version == pkg.b.release.version %}active{% else %}inactive{% endif %} 
      {% if version == project.latest.version %}latest{% else %}notlatest{% endif %}"> 
{% endwith %} 

しかし、確かにビューにそのロジックを置く方が良いでしょう:

context_data = { 
    'class_active': v.release.version == pkg.b.release.version and "active" or "inactive", 
    'class_latest': v.release.version == project.latest.version and "latest" or "notlatest", 
    ... } 

とテンプレートで:

<div class="pkg-buildinfo {{ class_active }} {{ class_latest }}" 
+0

これは、class_activeではなくv.class_active( 'v'はループ変数)でなければなりません。 –

3

カスタムフィルタは、素敵な選択肢かもしれません。

@register.filter 
def active_class(obj, pkg): 
    if obj.release.version == pkg.b.release.version: 
     return 'active' 
    else: 
     return 'inactive' 

とテンプレートでそれを使用します。

<div class="pkg-buildinfo {{ obj|active_class:pkg }}" 
+0

1年後に私のコードを読むと驚くかもしれません( "ビューとテンプレート以外の場所を見る必要がありますか?" "なぜ、 'active_class'は' obj'クラスのメソッドではありませんか?それ以外は良い。 –