Angular Checkbox Value to Typescript - html

Question

i'm trying to make a quiz where there is a card and 4 questions.
I have the 4 questions Like this
<div class="col-md-6">
<div class="option" id="Answer1">
<label class="Answer1">
<input value= "Answer1"
type="checkbox"
(change) ="CheckAnswer(value)"/>{{question.answer1}}
</label>
</div>
<div class="option" id="Answer2">
<label class="Answer2">
<input value= Answer2
type="checkbox"
(change) ="CheckAnswer(value)"/>{{question.answer2}}
</label>
</div>
<div class="option" id="Answer3">
<label class="Answer3">
<input value= "Answer3"
name="Answer3"
type="checkbox"
(change) ="CheckAnswer(value)"/>{{question.answer3}}
</label>
</div>
<div class="option" id="Answer4">
<label class="Answer4">
<input value= "Answer4"
type="checkbox"
(change) ="CheckAnswer(value);"/>{{question.answer4}}
</label>
</div>
</div>
But now i am trying to give the value of the one that has been pressed to my TS file with the method CheckAnswer(value).
This is my method in TS to test if the value is given . In my console it keeps saying value is undefined
CheckAnswer(value : string) {
console.log(value);
}

Answer 1

You're getting undefined because value is undefined in CheckAnswer(value) in the HTML.
Try this for all your inputs:
<input value= "Answer4"
type="checkbox"
(change)="CheckAnswer($event);"/>{{question.answer4}}
And the method:
CheckAnswer(event : any) {
console.log(event); // should log something now
console.log(event.target.value); // should be the value of the checkbox
}