Javascript 错误TS2339:属性'；imageID'；不存在于类型'；HTMLElement'；

试图使用全局变量imageID获取getImage的值，但不断获取错误“类型“HtmleElement”上不存在属性“imageID”。 要将HtmleElement分配给全局变量imageID。有没有办法将变量解析为字符串或其他什么？ 如有任何建议，将不胜感激

仪表板.component.ts

 import {Component,Input,OnChanges,OnInit,SimpleChanges} from '@angular/core';
import {ActivatedRoute} from '@angular/router';
import {Emotion} from 'emotion';
import {EmotionService} from 'emotion.service';



@Component({
    selector: 'dashboard',
    templateUrl: './dashboard.component.html',
    styleUrls: ['./dashboard.component.css']
})
export class DashboardComponent implements OnInit {
    emotions: Emotion[] = [];
    emotion: string;
    imageID: any;
    constructor(private emotionService: EmotionService) {}

    ngOnInit() {
        this.getEmotions();
       // this.makeMatch();

        //function to randomize and get face images
        var w = document.getElementById('wrapper');
        var button = document.getElementById('randomize');
        var images = w.children; // inner elements, your image divs
        // a function to hide all divs
        var hideDivs = function(imgs: HTMLCollection) {
            for (var img of < any > imgs) {
                (img as HTMLElement).style.display = 'none';
            } //for
        } //hideDivs

        hideDivs(images); // hide all initially

        button.addEventListener('click', function(event) {
            console.log('');
            console.log('%c=============================', "color: blue");
            console.log('%c In getFaces method', "color: blue", );
            var rnd = Math.floor(Math.random() * images.length); // get random index
            hideDivs(images); // hide all images

            (images[rnd] as HTMLElement).style.display = 'block'; // show random image
            (event.target as HTMLElement).textContent = 'Click one more time!';
            var getImage = (images[rnd] as HTMLElement);


                    //where error occurs
           this.imageID = getImage.id;


            // this.imageID as HTMLElement = images[rnd].getAttribute('alt');
              console.log('%c Image ID for match making: ', imageID );
            console.log('%cImage ID: ', "font-weight: bold", getImage.id);
           // console.log('%cAll image data:', "font-weight: bold", images[rnd]);
            console.log('%c=============================', "color: blue");
            console.log('');

        }) //button

import{Component，Input，OnChanges，OnInit，SimpleChanges}来自'@angular/core'；
从'@angular/router'导入{ActivatedRoute}；
从“情感”中导入{Emotion}；
从'emotion.service'导入{EmotionService}；
@组成部分({
选择器：“仪表板”，
templateUrl:“./dashboard.component.html”，
样式URL:['./dashboard.component.css']
})
导出类DashboardComponent实现OnInit{
情绪：情绪[]=[]；
情感：弦；
imageID：任何；
构造函数（私有emotionService:emotionService）{}
恩戈尼尼特（）{
这个。getEmotions（）；
//这是makeMatch（）；
//函数可随机化并获取人脸图像
var w=document.getElementById（'wrapper'）；
var button=document.getElementById（'randomize'）；
var images=w.children；//内部元素，图像divs
//隐藏所有div的函数
var hideDivs=函数（imgs:HTMLCollection）{
对于（var img ofimgs）{
（img作为HTMLElement.style.display='none'；
}//为了
}//希迪维斯
hideDivs（图像）；//最初隐藏所有
按钮。addEventListener（'click'，函数（事件）{
控制台日志（“”）；
console.log（“%c======================================”，“颜色：蓝色”）；
log（“%c在getFaces方法中”，“颜色：蓝色”，中）；
var rnd=Math.floor（Math.random（）*images.length）；//获取随机索引
hideDivs（图像）；//隐藏所有图像
（图像[rnd]作为HTMLElement）。style.display='block'；//显示随机图像
（event.target作为HtmleElement）.textContent='再单击一次！'；
var getImage=（图像[rnd]作为HTMLElement）；
//发生错误的地方
this.imageID=getImage.id；
//this.imageID为HTMLElement=images[rnd].getAttribute（'alt'）；
console.log（“%c匹配的图像ID:”，imageID）；
console.log（“%cImage ID:”，“font-weight:bold”，getImage.ID）；
//log（“%cAll image data:”，“font-weight:bold”，images[rnd]）；
console.log（“%c======================================”，“颜色：蓝色”）；
控制台日志（“”）；
})//按钮

发生错误的原因是代码中的===按钮

button.addEventListener('click', function(event) {
       ...
       this.imageID = getImage.id;
       ...
    })

如果要将imageID作为全局变量写入，只需使用window

window.imageID = getImage.id;

如果要将imageID写入类实例属性，请使用bind

button.addEventListener('click', function(event) {
       ...
       this.imageID = getImage.id;
       ...
    }.bind(this))

或箭头函数

button.addEventListener('click',(event) => {
       ...
       this.imageID = getImage.id;
       ...
    })

谢谢你，.bind（这个））是我想要的答案。