2016-05-17 5 views
0

検索を試みましたが、なんとか私はhtml要素の中に現実的なコードを使用して動的タグを追加する必要があると考えています。 これが良い習慣であるかどうかわかりませんが、質問したいと思っています。 今、hrefのクラス属性にcssclassを適用する方法を知っています。しかし、もし私が属性全体を "href"にclass = 'one' "を注入したいのであれば、どうすればいいのですか?HTML属性の視覚的なコードで条件付きロジックを追加する方法

これを行うことができます。 「それは何ではありませんので、要素を維持するか削除するかどうかを判断するために使用data-sly-test私は

<a href="${properties['jcr:titleurl']}" class="${properties.openinnewwindow ? 'nonunderline' : ''}"> <h3>${properties['jcr:title']}</h3></a> 

ような何かを行うことができます知っているが、私はこれをしたい、

<div class="col-md-12">  
<a href="${properties['jcr:titleurl']}" data-sly-test="${properties.openinnewwindow ? 'class=one' : class='two'}"> <h3>${properties['jcr:title']}</h3></a> 

+0

コード内で何をしようとしているのか正確に説明できますか?おそらくコードの文脈についての説明でもあります。 – Dale

+0

こんにちは、はい、私は、目立つようにコードに割り当てでクラスタグの属性を注入しようとしています。前述のように、class = "$ {目に見えるコード}"のような変数にクラスを割り当てる方法を知っていますが、代わりにやりたいことは、hrefタグ内に "class = one"全体を割り当てることです。クラス属性が必要ない場合もあるので、これは重要です。 例:一部のhtmlにclass属性があり、いくつかのhtmlがそうでない場合があります。 私は、data-slyタグがHtml要素の中でどのように動作するのかを追っていないと思います。 もっと明快にする必要がある場合はお知らせください。 – Rahul

答えて

5

再探しています。

変数がnullまたは空白の場合は、class属性が不要であると述べました。三項演算子を使用して提供されたコードは、これを行うだけです。

<a href="#" class="${properties.openinnewwindow ? 'nonunderline' : ''}">link</a> 

視覚的には、truthy/falseyという概念のJavaScriptと非常によく似ています。あなたの例では、openinnewwindowが真実(true、nullでない、または未定義でないなど...)の場合、クラス属性はnonunderlineに等しくなります。 openinnewwindowがfalseの場合、class属性はレンダリングされたHTMLには表示されません。

このコードを書き込むもう1つの方法は、論理&&演算子です。この構文はあなたが求めているものです。

<a href="#" class="${properties.openinnewwindow && 'nonunderline'}">link</a> 

詳細については、Sightly specificationを参照してください。

関連する問題