角度を使って0-100のグラデーションで要素をスタイルする方法

Question

角度を使ってng-repeatを使ってリストを作成しています。私はグラデーションで各リストアイテムの背景をスタイルしたいと思う。オブジェクトに0〜100の数値があり、その数値に基づいて背景グラデーションのスタイルを設定したいと思います。私の問題の基本的な例については、fiddleをご覧ください。

UPDATE：

私はちょうど私には無用である、最初のフィドルが角1.0を使用していたが実現しました。より適切な角度1.3を使ってフィドルを作り直します。しかし、このバージョンの角度では受け入れられる答えはもはや機能しません。助言がありますか？ここで私は私のリスト項目の背景が$ scope.y値の勾配になりたい新しいfiddle

HERESに単純なオブジェクト

$scope.list = [ 
    {x:1,y:70}, 
    {x:2,y:80}, 
    {x:3,y:90}, 
    {x:4,y:100} 
] 

です。私はこれがng-styleを使って可能であると確信していますが、私はそれを理解することができないので、どんな助けも大歓迎です。

Answer 1

だけの簡素化

<li class="list-group-item" style="background-image: linear-gradient(to bottom, red {{x.x}}%, blue {{x.y}}%)" ng-repeat="x in list">{{ x.x }} 
    <span class="pull-right">{{ x.y }}</span>  
</li> 

Answer 2

私はあなたのコードでそれを試してみたし、それが働いて、これを試してみてください：

<span style="{{ 'background-image: linear-gradient(to bottom, rgba(255,255,255,0)' + x.x +'%, rgba(41,137,216,1)' + x.y + '%)' }}">Works now too.</span>