keyup.enter上的Angular 5錯誤

Question

我正在從angular 4.4升級到5.2

該應用程序運行正常，但在一個屏幕上出現錯誤

TableComponent.html：27錯誤TypeError：無法讀取ZoneDelegate.webpackJsonp上platform-b​​rowser.es5.js：3251處的null的'onAndCancel'屬性... / .. / .. / .. / zone.js / dist / zone在Zone.webpackJsonp的.js.ZoneDelegate.invoke（zone.js：392）... / .. / .. / .. / zone.js / dist / zone.js.Zone.run（zone.js：142）在NgZone.webpackJsonp ... / .. / .. / core / esm5 / core.js.NgZone.runOutsideAngular（core.js：4708）在KeyEventsPlugin.webpackJsonp ... / .. / .. / .. / ng2 -notify-popup / node_modules / @ angular / platform-b​​rowser / @ angular / platform-b​​rowser.es5.js.KeyEventsPlugin.addEventListener（platform-b​​rowser.es5.js：3250）在EventManager.webpackJsonp ... / .. / ../../ng2-notify-popup/node_modules/@angular/platform-b​​rowser/@angular/platform-b​​rowser.es5.js.EventManager.addEventListener（platform-b​​rowser.es5.js：2395）at EmulatedEncapsulationDomRenderer2.webpackJsonp ... / .. / .. / .. / ng2-notify-popup / node_modules / @ angular / platform-b​​rowser / @ angular / platform-b​​rowser.es5.js.DefaultDomRenderer2.listen（platform-b​​rowser.es5.js ：2914）在BaseAnimationRenderer。 webpackJsonp ... / .. / .. / .. / ng2-notify-popup / node_modules / @ angular / platform-b​​rowser / @ angular / platform-b​​rowser / animations.es5.js.BaseAnimationRenderer.listen（animations.es5。 js：491）在DebugRenderer2.webpackJsonp ... / .. / .. / core / esm5 / core.js.DebugRenderer2.listen（core.js：15475）在listenToElementOutputs（core.js：10618）

我將錯誤跟蹤到了一行代碼

<tr *ngFor="let row of data; let rowIndex = index"
      ...
      (keyup.enter)="onRowAction(row)"

如果我將其更改為（keyup），該錯誤消失並且該應用程序按預期工作（但由任何鍵觸發的功能）

綁定到單個鍵的角度是否有所變化？

Answer 1

我將使用（keyup）=“ onRowAction（row，$ event）”，然后檢查是否在onRowAction（）內按下了正確的鍵。

onRowAction(row: any, event: KeyboardEvent) {
    if (event.keyCode === 13) {
        // Do stuffz.
    }
}

Answer 2

我對此測試很感興趣，因此，使用Angular 5.2進行測試的結果是兩個小插件：

1. (keyup.enter)在重復的<tr> https://plnkr.co/edit/iTbp4oGD4gNb4IVloewF?p=preview內部的輸入元素上

2. (keyup.enter)在重復的<tr> ，仍然會為子DOM元素https://plnkr.co/edit/1AICpyAH4NlXTG9M88zC?p=preview觸發

因此，回答這個問題：不，它尚未更改，但仍然有效。 您遇到的問題必須特定於您的代碼。