AngularJS：如何根据控制器范围更改 ng 类三元运算符的值？答案

【问题标题】：AngularJS:How can i change value of the ng-class ternary operator as per the controller scope?AngularJS：如何根据控制器范围更改 ng 类三元运算符的值？
【发布时间】：2016-08-27 07:57:49
【问题描述】：

我的指令控制器中有以下范围变量，并且我的范围被评估为工作日或周末的变量值。如果是工作日，我需要将css类.weekDay设置为div，如果是周末，我需要将css类设置为.weekEnd。我在指令中使用的以下三元表达式对我不起作用？这里有什么问题，我可以在 ng-class 中评估我的控制器表达式吗？请帮忙。

$scope.toDay = "Monday";
 or 
$scope.toDay ="Sunday"


<div ng-class="{toDay=='Sunday'? 'weekEnd':'weekDay'}">

【问题讨论】：

标签： javascript css angularjs angular-directive

【解决方案1】：

您需要使用比较运算符===，因此您的代码应如下所示

<div ng-class="toDay === 'Sunday' ? 'weekEnd' : 'weekDay'">

【讨论】：

对不起。我已经尝试过今天 == '星期天'，但没有奏效。让我试试你的建议===。谢谢

【解决方案2】：

<div ng-class="[today === 'Sunday' ? 'weekend' : 'weekday']">

注意[] 而不是{} 和=== 而不是=。

【讨论】：

实际上你没有。您可以传递字符串/字符串变量、映射 ({}) 或字符串数组和/或映射。您附加的链接实际上解释了这一点。
在这种情况下使用 {} 不起作用，因为 {today === 'Sunday' ? 'weekend' : 'weekday'} 并没有真正评估为有效的 javascript 对象。

【解决方案3】：

试试这个：

$scope.toDay = "Monday";
 or 
$scope.toDay ="Sunday"


<div class="{{toDay==='Sunday'? 'weekEnd':'weekDay'}}">

【讨论】：

在 ng-class 中不可能使用三元运算符。 "表达式到 eval。评估的结果可以是表示空格分隔的类名的字符串、数组或类名到布尔值的映射。在映射的情况下，其值为真的属性的名称将作为 css 类添加到元素中。”
可以将三元运算符与ng-class 一起使用。见这里scotch.io/tutorials/the-many-ways-to-use-ngclass
好！但是您需要使用不带“{ ... }”（表达式）的示例：

【解决方案4】：

您实际上并不需要使用三级运算符，您可以稍微重构一下并使用...

<div ng-app ng-init="toDay = 'Monday'">
<h1 ng-class="{'weekEnd': toDay == 'Sunday', 'weekDay' : toDay != 'Sunday'}">
      Test Text
  </h1>
</div>

或者在这些方面进行一些比较

【讨论】：