次のような表現を作る方法はありますか?ng-class
条件付きですか?
たとえば、次のことを試しました。
<span ng-class="{test: 'obj.value1 == \'someothervalue\''}">test</span>
このコードの問題は、何であってもobj.value1
、クラス テストが常に要素に適用されることです。次のようにします。
<span ng-class="{test: obj.value2}">test</span>
が真の値と等しくない限りobj.value2
、クラスは適用されません。最初の例の問題は、次のようにして回避できます。
<span ng-class="{test: checkValue1()}">test</span>
関数はcheckValue1
次のようになります。
$scope.checkValue1 = function() {
return $scope.obj.value === 'somevalue';
}
これがどのように動作するのか疑問に思っていますng-class
。また、これに似たようなことをしたいカスタム ディレクティブも作成しています。ただし、式を監視する方法が見つかりません (おそらくそれが不可能で、このように動作する理由です)。
がここにありますplnkr私の言いたいことを示すためです。
ベストアンサー1
最初の試みはほぼ正しかったです。引用符なしでも機能するはずです。
{test: obj.value1 == 'someothervalue'}
がここにありますplnkr。
ngClassディレクティブは、trueまたはfalseを評価する任意の式で機能します。Javascript式に少し似ていますが、いくつかの違いがあります。ここ条件が複雑すぎる場合は、3 回目の試行で行ったように、truthy または falsey を返す関数を使用できます。
補足:論理演算子を使用して、次のような論理式を作成することもできます。
ng-class="{'test': obj.value1 == 'someothervalue' || obj.value2 == 'somethingelse'}"