测验应用程序 - 在按钮点击后比较输入和JSON的值

时间:2015-03-29 07:45:48

标签: json angularjs

我想制作简单的测验应用。 在我的JSON文件中,我有答案和答案的问题。 我想列出问题,为用户提供文本输入以及检查答案的按钮。点击按钮后,我将显示结果并标记绿色或红色问题,这些问题的答案是正确的或不正确的。

我能够列出问题,但我不知道点击按钮之后我可以通过所有输入并执行所有操作:(使用JSON文件中的相应答案检查它们,添加点,标记字段)。

我的JSON文件是:

[
{
    "id": 1, 
    "question": "How much is it: 2+2",
    "answer": ["4", "four"], 
    "points": 2
},
{
    "id": 2, 
    "question": "How much is it: 2*2",
    "answer": ["4", "four"], 
    "points": 3
},
{
    "id": 3, 
    "question": "How much is it: 2+2*2",
    "answer": ["6", "six"], 
    "points": 4
}]

HTML:

    <div class="col-sm-4">
      <h3>What are Your answers? </h3>
      <form>
            <div class="form-group" ng-repeat="item in answers">
                <label>Question (Id: {{item.id}}): {{item.question}}</label><br>
                <input type="text" name="{{item.id}}" id="{{item.id}}">
            </div>
          <button type="submit" class="btn btn-default" ng-click="calculatePoints()">Check</button>
      </form>
    </div>
    <div class="col-sm-4">
      <h3>Number of points which You have:</h3>        
      <span>{{e}}</span>
    </div>

控制器:

$scope.calculatePoints = function() {


};

1 个答案:

答案 0 :(得分:0)

首先您需要输入ng-model

其次,您可以传递answer元素并回答calculatepionts函数

 <input type="text" ng-model="item.currentAnswer" 
 name="{{item.id}}" id="{{item.id}}">

发送问题对象并回答计算功能

<button type="submit" class="btn btn-default" 
ng-click="calculatePoints(item,item.currentAnswer)">Check</button>

现在,您可以将答案与calculatePoints()

中的原始答案进行比较