Question

我正在使用ag-grid在我的angular 7.2.1应用程序中渲染表格。自定义单元格渲染器仅用于在将重定向到其他页面的行中渲染一个编辑按钮。

之前，我已经在不同的Angular版本的其他应用程序中完成了此操作，但是由于某种原因，在Angular 7应用程序中使用了相同的代码。我想我可能缺少一些非常简单的东西。

我创建了一个极简化的再现，该错误是我在此堆叠闪电击中看到的-https://stackblitz.com/edit/angular-v98mjs

如果单击“编辑”按钮，您将在控制台中看到此错误。

错误错误：无法读取未定义的属性“ navigate” ag-grid版本：-

我将以下版本用于ag-grid：-

“ ag-grid-angular”：“ ^ 20.2.0”，“ ag-grid-community”：“ ^ 20.2.0”，

请在上面的链接中查看stackblitz代码。

Answer 1

您需要使用Arrow Function来定义onEdit

onEdit = (row): void => {
  console.log('row is being edited', {row})
    this.router.navigate(['/new-url', { id: row.incidentId }], {
        relativeTo: this.route.parent
    });
};

更多示例：ag-grid server side infinite scrolling accessing props

看看更新的插件：https://stackblitz.com/edit/angular-oppxte

在没有arrow function的情况下，onEdit的{{1}}函数内部无法获取AppComponent的引用，因此，您得到了错误。

无法读取未定义的属性“ navigate”

在示例中，我还介绍了this.router和RootComponent，以实现更好的模块化。希望这一点会清楚。

在Ag-Grid中使用自定义单元格渲染器时无法读取未定义的属性“ navigate”

1 个答案: