Angular AnyChart 8.1，带角度行单击事件，不返回项目或期间信息

我正在为公司的甘特图项目创建POC。 我在Angular 5 web项目中使用Anychart版本8.1.0中的资源甘特图。 我已经设置了大部分图表，在互联网上查找不同的文档和建议，但我现在被点击事件卡住了。 根据Anychart中的示例，我发现以下代码用于侦听图表上的事件：

chart.listen("rowClick", function(event) {
  var msg = event['item'].get('name');
  if (event['period']) msg += '\nPeriod: ' + event['period']['id'];
  console.log(msg);
});

如果我们继续，我们可以更改上述代码段的代码：

chart.listen('rowSelect', function(e) {
  e.item.remove();
});

因此，这里我们看到事件获取了item和period属性。 但当我在POC项目中执行此操作时，项目和期间属性丢失：

这是代码片段：

chart: anychart.charts.Gantt;

ngOnInit() {
  this.chart = anychart.ganttResource();
}

ngAfterViewInit() {
this.ganttSvc.getGanttData(this.tokenManager.getUserId()).subscribe((values: 
  GanttDataRow[]) => {
  // set data to grid
  const treedata = anychart.data.tree(values, 'as-table');
  this.chart.data(treedata);
  // add to container and draw
  this.chart.container(this.container.nativeElement).draw();
  // scale
  this.chart.zoomTo('day', 1, 'first-date');
  // eventlisteners
  this.chart.listen('rowSelect', function() {
    event.preventDefault();
    this.clickedDetail(event);
  });
});

clickedDetail(event) {
if (event['period']) {
  this.selectedGanttItem = event['period'];
  this.toggleSideBar();
}

}

---

你知道我做错了什么吗？

不幸的是，index.d.ts中有一个与图表侦听器相关的bug。在index.d.ts文件的当前版本中，图表侦听器的回调函数不作为参数事件对象。这就是项目和期间属性丢失的原因。这个问题已经为人所知，我们的开发团队正在准备一个修复程序，该程序将在8.2.0版本发布时提供。当修复可用时，我们将通过此线程通知您。

我们的团队已经准备了8.2.1更新的开发预览，您可以在项目中试用。此更新包括index.d.ts的许多错误修复。 要获取此更新，请将“package.json”中当前的AnyChart依赖项替换为以下“AnyChart”：“8.2.1-rc.0” 或者您可以通过NPM手动下载：$NPM installanychart@8.2.1-rc.0

在此更新中，您可以访问侦听器中的“事件”对象

this.chart.listen('rowSelect', function(event) {
    event.preventDefault();
});

---

很快，我们的团队将提供8.2.1更新的公开发行版。

请尝试以下代码，这适用于anychart@8.2.1-rc.0：

chart: anychart.charts.Gantt = null;
  ngOnInit() {

    const rawData = [
      {
        'name': 'Activities',
        'actualStart': Date.UTC(2007, 0, 25),
        'actualEnd': Date.UTC(2007, 2, 14),
        'children': [
          {
            'name': 'Draft plan',
            'actualStart': Date.UTC(2007, 0, 25),
            'actualEnd': Date.UTC(2007, 1, 3)
          },
          {
            'name': 'Board meeting',
            'actualStart': Date.UTC(2007, 1, 4),
            'actualEnd': Date.UTC(2007, 1, 4)
          },
          {
            'name': 'Research option',
            'actualStart': Date.UTC(2007, 1, 4),
            'actualEnd': Date.UTC(2007, 1, 24)
          },
          {
            'name': 'Final plan',
            'actualStart': Date.UTC(2007, 1, 24),
            'actualEnd': Date.UTC(2007, 2, 14)
          }
        ]
      }];

    const treeData = anychart.data.tree(rawData, 'as-tree');    
    this.chart = anychart.ganttProject();
    this.chart.data(treeData);

    this.chart.listen('rowSelect', function (event) {
      console.log(event['item'].get('name'));
    });

  ngAfterViewInit() {
    this.chart.container(this.container.nativeElement);
    this.chart.draw();
  }

---

我的问题在这一部分：

this.chart.listen('rowSelect', function (event) {
      console.log(event['item'].get('name'));
    });

我有以下代码：

this.chart.listen('rowSelect', () => {
      this.clickedDetail(event);
    });

当我将其更改为以下内容时，它就起作用了：

this.chart.listen('rowSelect', (event) => {
      this.clickedDetail(event);
    });

在我掌握MouseClickEvent本身而不是图表中发出的事件之前。谢谢你的例子，它帮助了很多

---

只是一个小问题。我注意到您使用了rowSelect，而我以前使用的是rowClick。他们的行为有很大不同吗？

非常感谢您的更新。我们将期待更新。我已经更新到版本8.2.1。但关于数据，这并没有改变任何东西，似乎我无法获得项目或期间属性…我刚刚测试了anychart@8.2.1-rc.0，它可以与AnyGantt一起工作。请检查修改后的答案。我们的团队已经发布了一个公共8.2.1更新，您可以在您的项目中尝试。此更新包括index.d.ts的许多错误修复。要获取此更新，请执行“npm update”或在“package.json”中用以下“AnyChart”替换当前的AnyChart依赖项：“8.2.1”，或者您可以通过npm手动下载：$npm installanychart@8.2.1Is也可以用记号笔来做吗？因为我可以看到项目和期间。我可以看到那件物品用句号和记号笔托着他的孩子。但是我能知道单击了哪个标记吗？你是指时间线上的线/区域/文本标记吗？没有此处描述的里程碑标记：@gogessj4不幸的是，此事件返回了关于整个单击行的完整信息，而没有关于实际单击元素的信息。嗯，这很遗憾。。。当点击句点或标记以显示更详细的信息时，我们需要在图表顶部触发侧面板和模式窗口。在这段时间内，这一切都很顺利。是否有可能在将来将其包括在内？在我看来，这两个时期不会有太大的不同，因为他们都是同一排的孩子。还是我弄错了？目前，我认为我可以通过覆盖工具提示来解决标记的问题，但稍后将对此进行研究。是的，它们有一些不同之处。仅当您选择任何新行时，才会调度rowSelect。如果单击一行，则发送rowSelect事件。下一次单击同一行不会分派它，因为该行已被选中。单击任何其他行将再次分派它。无论选择状态如何，每次单击任何行时都会调度rowClick事件。