如何根据对象的状态显示一个类答案

【问题标题】：how to display a class according to the state of the object如何根据对象的状态显示一个类
【发布时间】：2016-08-30 16:52:05
【问题描述】：

我正在开发一个测验软件，我想在其中显示每个问题的数字指针。我怀疑如何在不同的问题状态下为指针显示不同的类以及在其上显示一系列数字。

我已经编写了两个场景

ng-class="{

    'ibps-answered': question.selected !== null,
    'ibps-not-answered': question.selected === null

    }",

    ng-click="quiz.setActiveQuestion($index)"">1

问题的四种不同状态如下

`class="ibps-not-visited"`:questions at initial stage without touching "`default`"

`class="ibps-not-answered"`:questions visited but options are not attempted

`class="ibps-review"`:"have a special button for marking it for review in future without answering it." 



class="ibps-answered":"Have attempted the questions"

class="ibps-review-answered":"have attempted and also marked for review"

第一个条件将是默认情况。我怎样才能达到其他四个条件。请给我一些建议。

【问题讨论】：

分享你的完整代码！！
我期待一个逻辑arvind，我不知道当这些事件发生时该对象会发生什么。而且这些都是表单的常见条件情况

标签： javascript angularjs frontend ng-class

【解决方案1】：

使用嵌套的内联 if-then 语句：

<div ng-class=" ... ? 'class-1' : ( ... ? 'class-2' : 'class-3')">

【讨论】：

【解决方案2】：

我会创建一个函数来返回类

ng-class={{getClass()}}

$scope.getClass = function(){
  //logic here
  return className;
}

你当然可以在函数中添加输入来扩展逻辑

【讨论】：

我需要将所有内容都放在 ng-repeat 中......如果有 100 个问题可用，我猜我不能这样做......而且我想要一个满足该条件的逻辑。跨度>
@NivasDhina 我修改了答案以更符合您的需要

【解决方案3】：

您可以在控制器中创建一个函数来控制和检查每个问题的状态，然后使用 ng-class 来应用每个类：

<li ng-class="{ 'ibps-answered':yourCtrl.isAnswered('Question1'),  'ibps-not-visited':yourCtrl.isNotVisited('Question1'), ....}">

如果您对问题进行编号，请将其用作函数参数中的标识符

如果标识符在您的问题数据中，它可以与 ng-repeat 一起使用

【讨论】：