angular 5模板表单检测表单有效性状态的更改 [英] angular 5 template forms detect change of form validity status

问题描述

反应形式组件可以侦听其包含的表单的有效性状态中的更改并执行一些compoment的方法?

are reactive forms the way to go in order to have a component that can listen for changes in the validity status of the form it contains and execute some compoment's methods?

使用[disabled]="#myForm.invalid"之类的templateRef可以禁用模板中的提交按钮，但这并不涉及组件的逻辑.

It is easy to disable the submit button in the template using templateRef like [disabled]="#myForm.invalid", but this does not involve the component's logic.

查看模板表单的文档我没有找到方法

推荐答案

如果只想获取status而不是value，则可以使用statusChanges:

If you want to get only the status and not the value you can use statusChanges:

export class Component {

    @ViewChild('myForm') myForm;

    this.myForm.statusChanges.subscribe(
        result => console.log(result)
    );
}

如果您甚至想更改数据，您可以订阅form的valueChanges并使用this.myForm.status检查表单的状态:

If you even want data changes, you can subscribe to the valueChanges of the form and check the status of the form using this.myForm.status:

export class Component {

    @ViewChild('myForm') myForm;

    this.myForm.valueChanges.subscribe(
        result => console.log(this.myForm.status)
    );
}

状态的可能值为:有效，无效，待处理或已禁用.

Possible values of status are: VALID, INVALID, PENDING, or DISABLED.

此处是相同的参考

这篇关于angular 5模板表单检测表单有效性状态的更改的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！