Как я могу обновить раскрывающийся список, если новое значение добавлено к входу в Angular?

 <main role = "main" class = "col-md-9 ml-sm-auto col-lg-10 px-4">
            <div class = "inner-adjust">

                <div class = "pt-3 pb-2 mb-3 border-bottom">
                    <h1 class = "h2">Quiz</h1>
                    <!--input type = "text" [(ngModel)] = "searchTerm" placeholder = "Search by Course Name" -->
                </div>
                <div class = "col-md-6">
                    <form (ngSubmit) = "submitChanges()">
                        <div class = "form-group p-2" *ngIf = "question as quesion">
                            <label for = "question">Question</label>
                            <input type = "text" name = "question" class = "form-control" [(ngModel)] = "ques"
                                placeholder = {{question.question}}>
                            <label for = "answer11">Answer 1</label>
                            <input type = "text" min = "0" step = "0.1" name = "answer11" class = "form-control"
                                [(ngModel)] = "answer1" placeholder = {{question.answer1}}
                                (change) = "updateDropDownValues(answer1)">
                            <label for = "answer2">Answer 2</label>
                            <input type = "text" min = "0" step = "0.1" name = "answer2" class = "form-control"
                                [(ngModel)] = "answer2" placeholder = {{question.answer2}}>
                            <label for = "answer3">Answer 3</label>
                            <input type = "text" min = "0" step = "0.1" name = "answer3" class = "form-control"
                                [(ngModel)] = "answer3" placeholder = {{question.answer3}}>
                            <label for = "answer4">Answer 4</label>
                            <input type = "text" min = "0" step = "0.1" name = "answer4" class = "form-control"
                                [(ngModel)] = "answer4" placeholder = {{question.answer4}}>
                            <form>
                                <mat-form-field appearance = "fill">
                                    <label for = "solution">Solution </label>
                                    <select [(ngModel)] = "solution" name = "solution">
                                        <option *ngFor = "let solution of possibleAnswers" [ngValue] = "solution"
                                            [ngSelected] = "question.solution">
                                            {{solution}}
                                        </option>,
                                    </select>
                                </mat-form-field>
                                <p></p>
                            </form>
                        </div>
                        <div class = "form-group p-2">
                            <button class = "btn btn-primary">Submit</button>
                        </div>
                    </form>
                </div>
            </div>
        </main>

import { Component, OnInit, Input } from '@angular/core';
import { Course } from 'src/app/course';
import { Router, ActivatedRoute } from '@angular/router';
import { AngularFireDatabase } from '@angular/fire/database';
import { AuthService } from '../../services/auth.service';
import { Question } from 'src/app/question'

@Component({
  selector: 'app-edit-question',
  templateUrl: './edit-question.component.html',
  styleUrls: ['./edit-question.component.css']
})
export class EditQuestionComponent implements OnInit {
  localAuthService: AuthService;
  courseName: string;
  questionID: number;
  course: Course;
  question: Question;
  ques: string;
  answer1: string;
  answer2 : string;
  answer3: string;
  solution: string;
  possibleAnswers : string[];

  constructor(private db: AngularFireDatabase, private router: Router, private authService: AuthService, private activatedRoute: ActivatedRoute) { 
    this.localAuthService = authService;
    this.activatedRoute.params.subscribe(event => {
      this.courseName = event.courseName;
      this.questionID = event.id;
      this.db.object('/Courses/' + this.courseName).valueChanges().subscribe(course => {
        this.course = course as Course;
        this.question = this.course.questions[this.questionID]
        this.possibleAnswers = new Array;
        this.possibleAnswers.push(this.question.answer1);
        this.possibleAnswers.push(this.question.answer2);
        this.possibleAnswers.push(this.question.answer3);
        this.possibleAnswers.push(this.question.answer4);
      });
    });
  }

  ngOnInit(): void {
    
  }

  submitChanges() {

  }

  updateDropDownValues(value: any ){
    this.possibleAnswers.push(value);
  }


}