Angular _this.exams.slice не является функцией - Угловая ошибка при инициализации

Question

Я сталкиваюсь с ошибкой в ​​Angular. Не знаю, как ее решить.

ERROR TypeError: _this.exams.slice is not a function
    at SafeSubscriber._next (exam.service.ts:17)
    at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.__tryOrUnsub (Subscriber.js:195)
    at SafeSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.SafeSubscriber.next (Subscriber.js:133)
    at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber._next (Subscriber.js:77)
    at Subscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/map.js.MapSubscriber._next (map.js:41)
    at MapSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/operators/filter.js.FilterSubscriber._next (filter.js:38)
    at FilterSubscriber.push../node_modules/rxjs/_esm5/internal/Subscriber.js.Subscriber.next (Subscriber.js:54)
    at MergeMapSubscriber.push../node_modules/rxjs/_esm5/internal/operators/mergeMap.js.MergeMapSubscriber.notifyNext (mergeMap.js:79)

Я пытаюсь получить следующее

Exam.service

import { Exam } from '../models/exam.model';
import { Injectable } from '@angular/core';
import { Subject } from 'rxjs';
import { HttpClient } from '@angular/common/http';

@Injectable({providedIn: 'root'})
export class ExamService {
  private exams: Exam[] = [];
  private examsUpdated = new Subject<Exam[]>();

  constructor(private httpClient: HttpClient) {}

  getExams() {
    this.httpClient.get<Exam[]>('http://localhost:3000/api/exam')
    .subscribe((examData) => {
      this.exams = examData;
      this.examsUpdated.next([...this.exams]);
    });
  }

  getExamsUpdateListener() {
    return this.examsUpdated.asObservable();
  }

  addExam(
    question: string,
    answer1: string,
    answer2: string,
    answer3: string,
    answer4: string,
    difficulty: string,
    year: string,
    subject: string) {
    const exam: Exam = {
      id: null,
      question: question,
      answer1: answer1,
      answer2: answer2,
      answer3: answer3,
      answer4: answer4,
      difficulty: difficulty,
      year: year,
      subject: subject,
    };
    this.httpClient.post<{message: string}>('http://localhost:3000/api/exam', exam)
      .subscribe((responseData) => {
        console.log(responseData.message);
        this.exams.push(exam);
        this.examsUpdated.next([...this.exams]);
      });
  }
}

Экспресс промежуточное ПО

app.get("/api/exam", (req, res, next) =>{
  Exam.find().then(documents => {
    res.status(200).json({
      exams: documents
    })
  })
});

Угловой компонент

  exams: Exam[] = [];
  private examSubscription: Subscription;

  constructor(public examService: ExamService) {}

  ngOnInit() {
    this.examService.getExams();
    this.examSubscription = this.examService.getExamsUpdateListener().subscribe((exams: Exam[]) => {
      this.exams = exams;
    });
  }

Схема экзамена

const mongoose = require('mongoose');

const examSchema = mongoose.Schema({
  question: {type: String, required: true},
  answer1: String,
  answer2: String,
  answer3: String,
  answer4: String,
  difficulty: String,
  year: String,
  subject: String,
});

module.exports = mongoose.model('Exam', examSchema);

Это происходит, когда я пытаюсь получить данные при инициализациикомпонент.Изменение промежуточного программного обеспечения Express на следующее собирает MongoDB в консоли, поэтому, похоже, это связано с промежуточным программным обеспечением.

app.get("/api/exam", (req, res, next) =>{
  Exam.find().then(documents => {
    console.log(documents)
    })
  })

Надеюсь, вы увидите, что не так, в противном случае я могу предоставить больше информации!Спасибо

Answer 1

Просто замените следующие фрагменты

this.examsUpdated.next([...this.exams]);

на

this.examsUpdated.next(this.exams);