CSS Unicodeコンテンツプロパティを動的に変更する

Question

divタグの背景を設定しています。これは、表の各行のフォントの素晴らしいアイコンです。このアイコンは、表示されているオブジェクトによって異なります。私はChanging CSS content property dynamicallyのようなコードを設定しようとしました。しかし、私のデータコンテンツはユニコードになります。次のように私は、角度コントローラに値を代入しています。その後、

if (type) { 
    if (type.image.includes('fa-hand-o-up')) { 
     type.background = '\f0a6'; 
    } else if (type.image.includes('fa-wrench')) { 
     type.background = '\f0ad'; 
    } else if (type.image.includes('fa-star')) { 
     type.background = '\f005'; 
    }    
    return type; 
} 

と、次のようにテーブルにそれらを含む：

<td> 
    <div class="text-center type-wrapper" 
     data-content="{{::dataItem.type.background}}"> 
     <span class="bold">{{::dataItem.type.name}}</span> 
    </div> 
</td> 

はしかし、これは単なる背景として0A6、0ad、および005を置きます'画像'。ユニコードコンテンツを動的に追加する方法はありますか、またはプレーンテキストのためだけにattr（data-xxx）ですか？

また、私は色のattr（データカラー）を追加しようとしましたが、それはどちらかと思われません。私はプレーンテキストの代わりに16進コードを使用しているためですか？私が正しくあなたの質問を得た場合

Answer 1

^...
が

span:before{ 
 
    content: attr(data-content); 
 
}

<span data-content="&#x00ff;"></span>

参照が&#で始まり、;で終わるとxは何が使われていることを意味&#x参照して前置してみてください16進数の値です。

Answer 2

これが私の仕事：https://stackoverflow.com/a/26025865/2077405

この形式で挿入し、JavaScriptで、文字列リテラル

$("a").attr ("data-content", "\u25BC");