Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/json/13.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 错误类型错误:无法读取属性';0';在Object.eval | Angular 10处未定义的_Javascript_Json_Angular_Typescript - Fatal编程技术网

Javascript 错误类型错误:无法读取属性';0';在Object.eval | Angular 10处未定义的

Javascript 错误类型错误:无法读取属性';0';在Object.eval | Angular 10处未定义的,javascript,json,angular,typescript,Javascript,Json,Angular,Typescript,当我试图从JSON获取数据时,我遇到了这个错误,JSON是我的spring启动应用程序对Angular的响应。我想为在线考试系统创建一个端到端的项目,但有一段时间我一直停留在这一点上,因为我无法在前端显示问题(角度) test.component.html(在*ngFor处,我收到了这个错误。) qns最初是未定义的。您必须对此做出解释。qns最初是未定义的。你必须对此负责。 <div class="progress"> <div class="

当我试图从JSON获取数据时,我遇到了这个错误,JSON是我的spring启动应用程序对Angular的响应。我想为在线考试系统创建一个端到端的项目,但有一段时间我一直停留在这一点上,因为我无法在前端显示问题(角度)

test.component.html(在*ngFor处,我收到了这个错误。)


qns
最初是
未定义的
。您必须对此做出解释。
qns
最初是
未定义的。你必须对此负责。
<div class="progress">
  <div class="determinate" [style.width.%]="(testService.qnProgress+1)*10"></div>
</div>
<div class="card blue-grey darken-1">
  <div class="card-content white-text">
    <span class="card-title">{{testService.qnProgress+1}}</span>
    <p>{{testService.qns[testService.qnProgress].Qn}}</p>
  </div>
  <div class="card-action">
    <ul class="collection answer">
      <ng-container *ngFor="let option of testService.qns[testService.qnProgress]?.Options;let i = index">
        <li *ngIf="option != null" class="collection-item" (click)="Answer(testService.qns[testService.qnProgress]?.QnID,i)">
          {{option}}
        </li>
      </ng-container>
    </ul>
  </div>
</div>
import { Component, OnInit } from '@angular/core';
import { TestService } from '../_services/test-service.service';
import { Router } from '@angular/router';
@Component({
  selector: 'app-test',
  templateUrl: './test.component.html',
  styleUrls: ['./test.component.css']
})
export class TestComponent implements OnInit {

  constructor( private router: Router, private testService: TestService) { }

  ngOnInit() {
if (parseInt(localStorage.getItem('seconds')) < 0) {
      this.testService.seconds = parseInt(localStorage.getItem('seconds'));
      this.testService.qnProgress = parseInt(localStorage.getItem('qnProgress'));
      this.testService.qns = JSON.parse(localStorage.getItem('qns'));
      if (this.testService.qnProgress == 10)
        this.router.navigate(['/result']);
      else
        this.startTimer();
   }
   else {
      this.testService.seconds = 0;
      this.testService.qnProgress = 0;
      this.testService.getQuestions().subscribe(
        (data: any) => {
          this.testService.qns = data;
          this.startTimer();
        }
      );
   }
  }

  startTimer() {
    this.testService.timer = setInterval(() => {
      this.testService.seconds++;
      localStorage.setItem('seconds', this.testService.seconds.toString());
    }, 1000);
  }

  Answer(qID, choice) {
    this.testService.qns[this.testService.qnProgress].answer = choice;
    localStorage.setItem('qns', JSON.stringify(this.testService.qns));
    this.testService.qnProgress++;
    localStorage.setItem('qnProgress', this.testService.qnProgress.toString());
    if (this.testService.qnProgress == 10) {
      clearInterval(this.testService.timer);
      this.router.navigate(['/result']);
    }
  }

}

import { HttpClient } from '@angular/common/http';
import { Observable } from 'rxjs';
import {Injectable} from "@angular/core";


@Injectable({
providedIn: 'root'
})
export class TestService{


readonly rootUrl = 'http://localhost:8080/api/auth';
qns: any[];
seconds: number;
timer;
qnProgress: number=1;
correctAnswerCount: number = 0;

//---------------- Helper Methods---------------
constructor(private http: HttpClient) { }
displayTimeElapsed() {
  return Math.floor(this.seconds / 3600) + ':' + Math.floor(this.seconds / 60) + ':' + Math.floor(this.seconds % 60);
}

getParticipantName() {
  var participant = JSON.parse(localStorage.getItem('participant'));
  return participant.Name;
}


//---------------- Http Methods---------------

insertParticipant(name: string, email: string) {
  var body = {
    Name: name,
    Email: email
  }
  return this.http.post(this.rootUrl + '/InsertParticipant', body);
}

getQuestions() {
  return this.http.get(this.rootUrl + '/Questions');
}

getAnswers() {
  var body = this.qns.map(x => x.QnID);
  return this.http.post(this.rootUrl + '/Answers', body);
}

submitScore() {
  var body = JSON.parse(localStorage.getItem('participant'));
  body.Score = this.correctAnswerCount;
  body.TimeSpent = this.seconds;
  return this.http.post(this.rootUrl + "/UpdateOutput", body);
}

}