Question

我正在尝试创建一个组件，允许用户选择要执行的操作＆＃34; tests＆＃34;使用表格界面。表的每一行都是一个单独的子组件，其父组件包含表头和子组件行，这些行是使用*ngFor创建的。

除了我需要标题中的复选框以检查所有子组件复选框和标题中的选择以选择所有子组件以等于标题中的所选选项之外，一切都进展顺利。复选框看起来像是有效的（如在Plunker中演示的那样），但是当选中header复选框时，父组件中的事件处理程序不会获得更新的选中值，但是当选中实际的行复选框时，它会生成。该演示有复选框将内容打印到控制台。我希望标题复选框能够触发所有复选框＆＃39; s＆＃39; s＆＃39; event并向控制台打印多个语句（每个表行两行）。

我开始使用这些部分来处理标题的选择更改，但是在使用{{1}填充选项时如何选择选择的选项有点困难}。

我不知道这是否重要，但我使用的是angular2-beta 15，如果可能的话，我会尝试使用此版本。

下面是Plunker和代码转储。

*ngFor

Plunker link

Answer 1

这不是*ngFor的问题，而是在父＆lt; - ＆gt;子通信中阻止任何循环的问题。我查了一下 - 这会对你有所帮助：将此代码添加到您的子组件并尝试

 ngOnChanges(changes: SimpleChanges) {
  if (changes.checkboxValue) {
    this.checked.emit({
      value: changes.checkboxValue.currentValue,
      test: this.test
    });
  }
  if (changes.selectedAction) {
  ...
  }
 }

也许您必须导入并添加implements onChanges类，但这不是强制性的

Angular2父组件不触发子组件的事件

1 个答案: