如何识别ag网格中的每个按键事件答案

【问题标题】：How to identify each key pressed event in ag grid如何识别ag网格中的每个按键事件
【发布时间】：2020-04-20 22:52:01
【问题描述】：

当我在文本字段中输入字母“A”时，我想将该字符发送到输入脚本，

仅供参考，我的目标是“当我从键盘按键时，我想发送每个字符来键入脚本”

【问题讨论】：

分享你的代码

标签： angular typescript ag-grid ag-grid-angular

【解决方案1】：

StackBlitz Link 的工作示例

你可以这样使用...

<ag-grid-angular 
    style="width: 500px; height: 150px;" 
    class="ag-theme-balham"
    [rowData]="rowData" 
    [columnDefs]="columnDefs"
    (cellKeyPress)="onCellKeyPress($event)"
    [modules]="modules">
</ag-grid-angular>

这里cellKeyPress 事件为每个单元格触发，然后我们的自定义onCellKeyPress($event) 被调用。然后在您的 component.ts 中使用...

onCellKeyPress(e){
  console.log(e.event.key);
}

【讨论】：

感谢亲爱的，下面提到的示例在 stackBlitz 中运行良好，但在我的代码中 onCellKeyPress 没有在编辑时触发 .. 是否必须使用 [modules]=“modules”？
[modules] = "modules" is called property binding from .ts file` 到html Template 这样你就可以说<ag-grid-angular> 是ag-grid 模块的AllCommunityModules 的一部分，通过在.ts 文件中使用@ 设置属性987654331@ 并且模块的这个属性值使用 angular [modules] = "modules" 的属性绑定传递给 html
但它会抛出错误，例如无法绑定到“模块”，因为它不是“ag-grid-angular”的已知属性
在自己的模块或app.module.ts文件中导入ag-module..import { AgGridModule } from '@ag-grid-community/angular'; @NgModule({ imports: [ BrowserModule, FormsModule, AgGridModule.withComponents([]) ],
如何在不使用@ag-grid-community/angular的情况下调用按键事件

【解决方案2】：

您可以尝试使用以下代码：

app.component.html

<input type="text" (keyup)="getLastCharacter($event)">

app.component.ts

getLastCharacter($event) {
  console.log($event.target.value[$event.target.value.length - 1]);
  return $event.target.value[$event.target.value.length - 1]
}

此函数将始终返回您在文本输入中添加的最后一个字符，您可以在 TS 中做任何您想做的事情。

如果你想发送整个字符串，你可以这样实现

app.component.html

<input type="text" (keyup)="getLastCharacter($event)">

app.component.ts

getLastCharacter($event) {
  console.log($event.target.value);
  return $event.target.value;
}

【讨论】：