在angular 4中-新密码和确认密码的自定义验证器出现"Cannot read property of null“错误

在Angular 4中，当自定义验证器中出现"Cannot read property of null"错误时，通常是由于未正确处理表单控件的值或未正确绑定验证器函数导致的。

要解决这个问题，首先需要确保在自定义验证器函数中正确处理表单控件的值。通常情况下，我们可以通过使用FormControl对象的value属性来获取表单控件的值。例如，如果我们有一个新密码和确认密码的表单控件，可以使用以下代码来获取它们的值：

const newPassword = formGroup.get('newPassword').value;
const confirmPassword = formGroup.get('confirmPassword').value;

接下来，我们需要确保在自定义验证器函数中正确处理表单控件的状态。通常情况下，我们可以通过使用FormControl对象的valid属性来检查表单控件是否有效。例如，如果我们要验证新密码和确认密码是否匹配，可以使用以下代码：

if (newPassword !== confirmPassword) {
  return { passwordMismatch: true };
}

在上面的代码中，如果新密码和确认密码不匹配，我们返回一个包含passwordMismatch属性的对象，表示验证失败。

最后，我们需要确保在模板中正确绑定自定义验证器函数。通常情况下，我们可以使用Validators对象的compose方法来将多个验证器函数组合在一起。例如，如果我们有一个名为passwordForm的表单组，可以使用以下代码来绑定自定义验证器函数：

this.passwordForm = this.formBuilder.group({
  newPassword: ['', Validators.required],
  confirmPassword: ['', Validators.required]
}, { validator: this.passwordMatchValidator });

在上面的代码中，我们将passwordMatchValidator函数作为第二个参数传递给FormGroup的构造函数，以将其作为表单组的验证器。

总结起来，在Angular 4中解决"Cannot read property of null"错误的步骤如下：

1. 确保正确处理表单控件的值。
2. 确保正确处理表单控件的状态。
3. 确保在模板中正确绑定自定义验证器函数。

对于更详细的解释和示例代码，您可以参考腾讯云的Angular开发文档：Angular开发文档