角度复选框值到打字稿

时间:2021-05-18 15:39:42

标签: html css angular typescript undefined

我正在尝试做一个有卡片和 4 个问题的测验。 我有 4 个这样的问题

<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>

但现在我正在尝试使用方法 CheckAnswer(value) 将已按下的值提供给我的 TS 文件。 这是我在 TS 中测试是否给出值的方法。在我的控制台中,它一直说值未定义

 CheckAnswer(value : string) {
   
console.log(value);
}

1 个答案:

答案 0 :(得分:0)

由于 value 在 HTML 的 CheckAnswer(value) 中未定义,因此您未定义。

为所有输入试试这个:

<input value= "Answer4"
    type="checkbox"
    (change)="CheckAnswer($event);"/>{{question.answer4}}

和方法:

CheckAnswer(event : any) {
   
console.log(event); // should log something now
console.log(event.target.value); // should be the value of the checkbox
}