2017-03-15 30 views
0

次のように、条件によっては表のセルに代替色の組み合わせでテキストを表示します。ng-ifとng-styleを使用した条件に基づいた表のセルのテキストの色の変更

<tr ng-repeat="x in data"> 
<td> 
<span ng-if="((x.time2 < x.time1) || (x.time2 < x.time3))" ng-style="color:red" {{x.val}}></span> 
<span ng-if="((x.time2 === x.time1) && (x.time2 === x.time3)" ng-style="color:blue" {{x.val}}></span> 
</td> 
</tr> 

x.time2はx.time1よりも小さいですが、値は赤色で表示されません。サンプル時間値は、time1 = "2017-03-15 06:06:56"、time2 = "2017-03-08 07:09:40"、time3 = "2017-03-08 07:09:40"です。すべての時間値は文字列形式です。

答えて

1

は、このようにコードを変更してください:

<table> 
     <tbody> 
      <tr ng-repeat="x in data"> 
      <td> 
      <span ng-if="x.time2 < x.time1 || x.time2 < x.time3" ng-style="{color: 'red'}" >{{x.val}}</span> 
      <span ng-if="x.time2 === x.time1 && x.time2 === x.time3" ng-style="{color: 'blue'}" >{{x.val}}</span> 
      </td> 
      </tr> 
     </tbody> 
    </table> 

私もそれが誤りだったかどうかはわからない...スパン内x.valを移動しました。

+0

値は印刷されますが、色は変化しません。 –

+0

私はそれを試してみましたが、私の場合はうまくいきます...あなたは中括弧と引用符を色の名前に追加しましたか? – Fabio

+0

色の名前、つまり赤と青を引用符で忘れてしまった。今それは働いている。ありがとうございました。 –

関連する問題