如何在 angular 5 应用程序中获取复选框值 [英] How to get checkbox value in angular 5 app

问题描述

我正在处理 Angular 复选框，需要读取给定 ng-true-value/ng-false-value 或布尔值的值，不确定我缺少什么从代码.我正在读取事件但不确定要读取哪个值??

模板

<输入类型=复选框"名称=问题答案状态"ng-model="检查"ng-true-value = "answerProvided"ng-false-value="questionAnswerNotProvided"(change)="isAnswerProvided($event, check)"/>答案 提供?

组件

 isAnswerProvided(event: any, check:any){console.log("问题答案未提供 responseId::",this.responseId, " questionId::",this.questionId, " check::", check );控制台日志(事件)；}

解决方案

如果你使用的是 Angular 2> 你应该使用 checked 属性来使用单向绑定，UI 只会读取check 的值.使用此方法，您必须更新组件中的 check 值.

 <输入类型=复选框"名称=问题答案状态"[检查]="检查"(change)="isAnswerProvided($event, check)"/>答案 提供?

或者如果你是双向绑定，状态完全由 UI 控制，你可以像这样使用 ngModel:

 <输入类型=复选框"名称=问题答案状态"[(ngModel)]="检查"(change)="isAnswerProvided($event, check)"/>答案 提供?

I am working on Angular checkbox and need to read value either given ng-true-value / ng-false-value or boolean value not sure what I am missing from code. I am reading event but not sure which value to read??

template

<div>

 <input 
    type="checkbox" 
    name="questionAnswerState" 
    ng-model="check"
    ng-true-value = "answerProvided"
    ng-false-value="questionAnswerNotProvided" 
    (change)="isAnswerProvided($event, check)"
    /> Answer Provided?

component

 isAnswerProvided(event: any, check:any)
  {
    console.log("question answer not provided responseId:: ",this.responseId, " questionId::",this.questionId, "  check::", check );
    console.log(event);
  }

解决方案

If you're using Angular 2> you should use the checked attribute for using one way binding, that the UI will only read the value of check. Using this method you would have to update the check value in your component.

 <input 
    type="checkbox" 
    name="questionAnswerState" 
    [checked]="check"
    (change)="isAnswerProvided($event, check)"
    /> Answer Provided?

or if you're after two way binding, where the state is controlled completely by the UI you can use ngModel like this:

 <input 
    type="checkbox" 
    name="questionAnswerState" 
    [(ngModel)]="check"
    (change)="isAnswerProvided($event, check)"
    /> Answer Provided?

这篇关于如何在 angular 5 应用程序中获取复选框值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！