Railsのタグ構文は、引用符が</p> <pre><code><img data-interchange="[assets/img/interchange/small.jpg, small], [assets/img/interchange/medium.jpg, medium], [assets/img/interchange/large.jpg, large]"> </code></pre> <p>が困難で生成しようとして

Question

を除外値。

<%= tag "img", data: { interchange: ["[#{photo.image_url(:base).to_s}, small]", "[#{photo.image_url(:big).to_s}, medium]", "[#{photo.image_url(:desktop).to_s}, large]"] } %> 

はHTMLを生成しますが、結果は"が生成されます

<img data-interchange="[&quot;[https://[...]base_20160529_115006.jpg, small]&quot;,&quot;[https://[...]big_20160529_115006.jpg, medium]&quot;,&quot;[https://[...]desktop_20160529_115006.jpg, large]&quot;]" /> 

としてまだ動作不能です。

何があなたがJSONに物事をエンコードするためにactivesupportののto_jsonを使用することができ、レールには、適切なHTML文字列

Answer 1

を取得するための適切な構文です。あなたはフロントエンドにデータを使用する必要がある場合は、getAttributeを介して、またはjQueryのdataで値を取得後、あなたはJSON.parseを使用することができ、フロントエンドに

<img data-interchange="[[\"assets/images/interchange/base.jpg\",\"small\"],[\"assets/images/interchange/big.jpg\",\"medium\"],[\"assets/images/interchange/desktop.jpg\",\"large\"]]" /> 

次に生成

<%= tag "img", data: { interchange: [[photo.image_url(:base), 'small'], [photo.image_url(:big), 'medium'], [photo.image_url(:desktop), 'large']].to_json } %> 

。

var text = JSON.parse(element.getAttribute('data-interchange'));