javascript - Angular 5 keyup 事件被触发两次

Question

所以我有一个非常简单的应用程序，实际上是一个简单的 hello world，在此之上我为设计添加了 bootstrap，为组件添加了 ng-bootstrap。

在一个 ts 文件中，我有以下代码:

showMeTheKey(event: KeyboardEvent) {
    console.log(event);
}

在一个 html 页面上，我有以下代码:

<input (keyup)="showMeTheKey($event)">

每当我按下一个键时，这会导致两个事件出现在控制台上，除了时间戳当然不同之外，这些事件是相同的(这里有一些微秒的差异)

知道为什么会这样吗？还是正常？

谢谢!

编辑:在这里回答评论是我的应用程序代码

这是我的应用程序模块:

import { HttpClientModule } from '@angular/common/http';
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { InputModule } from './input/input.module';
import { NavbarComponent } from './navbar/navbar.component';

@NgModule({
  declarations: [
    AppComponent,
    NavbarComponent,
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    InputModule,
    NgbModule.forRoot()
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

这是我的应用组件:

import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    title = 'app';

    showMeTheKey(event: KeyboardEvent) {
        console.log(event);
        event.stopImmediatePropagation();
    }
}

这是我的应用程序 html:

<input (keyup)="showMeTheKey($event)">

编辑 2:这是一个带有编辑器的在线演示，因此您可以访问代码(当然，在现场演示中按 F12 可以查看日志):

现场演示:https://angular-znlk4p.stackblitz.io

编辑:https://stackblitz.com/edit/angular-znlk4p

编辑 3:这是演示中事件触发两次的打印屏幕 image

Answer 1

嘿，我发现了我的错误!

我正在通过虚拟机进行开发!我正在使用的软件出于某种原因发送了两次 key ......即使我只输入一个字母，也很奇怪......

我需要向制造商报告该错误!

我在非 VM PC 上测试了我自己的演示，它确实可以正常工作!

谢谢大家帮我找到这个!

干杯!