属性"checked"在类型"HTMLElement" angular 4上不存在 [英] Property 'checked' does not exist on type 'HTMLElement' angular 4

问题描述

我正在尝试从ts(类型脚本)文件中获取复选框检查值.为此，我有一个布尔变量，目的是使用此变量值显示和隐藏div，但我遇到了问题.请帮助我解决此问题，并为我提供正确的方法.这是我的代码...

i am trying to get checkbox checked value from ts(type script) file. For this, I have a Boolean variable and the purpose is to show and hide div using this variable value but I am facing a problem. Please help me to solve this and also give me the right way to do this. Here is my code...

html代码

**checkbox code**abcde" class="form-check-input" id="abcde" value="1"
(change)="checked('abcde')"> abcde

显示和隐藏代码

*ngIf='shown'

ts文件

checked(value) {

    let get_id = document.getElementById('abcde');

    if (get_id.checked == true) {
        this.shown = true
    }
    else if (get_id.checked == false)
        this.shown = false;
}

当我运行ng serve时，我得到属性'checked'在类型'HTMLElement'上不存在"

When i run ng serve then I get "Property 'checked' does not exist on type 'HTMLElement'"

提前谢谢！

推荐答案

//Typescript File (app.component.ts)         
    import { Component } from 'angular/core';
                @Component({
                  selector: 'app-root',
                  template: './app.component.html',
                  styleUrls: ['./app.component.css']
                })
                export class AppComponent {
                   public shown = false;
                } 

    //Html Code (app.component.html)
        <form #myForm='ngForm'>      
                <input type="checkbox" class="form-control" 
                     #checkBox="ngModel" 
                  [(ngModel)]="shown" name="checkBox">
        </form>
                <div *ngIf="shown"> 
                    <!---Your Code Here...--->
                </div>

在这里，这是基于复选框选择和取消选择显示和隐藏div元素的一种方法.此处使用显示的变量完成了两种方式的绑定.

Here, This is one of the way to do show and hide div element on basis of checkbox selection and deselection. Two way binding is done here with shown variable.

这篇关于属性"checked"在类型"HTMLElement" angular 4上不存在的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！