在输入 angular 2 动态表单上添加事件

Question

我按照 cookbook 中的教程使用动态表单创建了一个表单，现在我想在某些输入发生变化时进行捕捉，因此如何添加 (change) 事件，将函数作为参数发送给调用；像

  new TextboxQuestion({
    key: 'test',
    label: 'Test ',
    type: 'text',
    onChange: 'test()',
    order: 0
  })

谢谢

Answer 1

由于您是动态创建此表单的，因此您应该可以在控制器中访问它。 Angular 2 使用了 FormControl 的概念，这是一个与表单控件交互的非常强大的工具。我会跳过很多细节，但我会指出几件事：

您可以访问 FormControl.valueChanges，这在该文档中可能并不明显，因为 FormControl 继承自 AbstractControl，一个提供大量有用功能的超类，其中大部分与 Angular 1 表单功能非常相似。

本质上，您要做的是利用 observables。如果您不熟悉它们，则应该阅读它们。 Christoph Burgdorf has a great article on them 实际上，为了方便您，使用 FormControl.valueChanges 作为他关于如何使用它们的示例的一部分。哦，多么美好的一天！

但基本上，简而言之，您希望按照以下思路做一些事情：

this.textboxControl.valueChanges.subscribe(value => {
   //... do your stuff here with 'value'
});

这显然假设您有一个您想要响应的表单控件实例。

非常重要 在使用 observables 时你 UNSUBSCRIBE 在 ngOnDestroy 方法中你的控制器；否则订阅将在您完成订阅后挂起并且内存泄漏。

在输入 angular 2 动态表单上添加事件

add event on input angular 2 dynamic form

javascript

dynamicform

angular