条件式を使用したAngularJS ngスタイル 質問する

条件式を使用したAngularJS ngスタイル 質問する

私は次のように問題を処理しています:

ng-style="{ width: getTheValue() }"

しかし、コントローラー側でこの機能を回避するには、次のようにする方がはるかに望ましいです。

ng-style="{ width: myObject.value == 'ok' ? '100%' : '0%' }"

これどうやってするの?

ベストアンサー1

簡単な例:

<div ng-style="isTrue && {'background-color':'green'} || {'background-color': 'blue'}" style="width:200px;height:100px;border:1px solid gray;"></div>

{'background-color':'green'} trueを返す

または同じ結果:

<div ng-style="isTrue && {'background-color':'green'}" style="width:200px;height:100px;border:1px solid gray;background-color: blue"></div>

その他の条件付き可能性:

<div ng-style="count === 0 && {'background-color':'green'}  || count === 1 && {'background-color':'yellow'}" style="width:200px;height:100px;border:1px solid gray;background-color: blue"></div>

おすすめ記事