在Angular中，通过使用ngIf或ngShow指令来控制表单字段的显示或隐藏。但是，如果表单字段被设置为"display:none"属性，则在表单提交时，Angular默认不会对这些字段进行验证。这可能会导致用户提交不完整或不准确的表单数据。

为了解决这个问题，我们可以使用Angular的自定义验证器，将验证逻辑添加到这些隐藏字段上。这将确保即使这些字段被隐藏，表单提交时也会执行相应的验证。

以下是一个例子，它使用Angular的自定义验证器来验证设置为"display:none"的字段：

HTML代码：

  
  

    Name is required!
  
  Submit

TS代码：

import { Component } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';

@Component({
  selector: 'app-root',
  template: `
    

      
      

        Name is required!
      
      Submit
    
  `,
})
export class AppComponent {
  myForm = this.fb.group({
    name: ['', Validators.required],
  });

  constructor(private fb: FormBuilder) {
    this.myForm.get('name').setValidators([Validators.required]);
  }
}

在上面的代码示例中，我们在"name"字段上设置了"display:none"，但是我们也为该字段添加了一个自定义验证器，使用Validators.required来确保名称输入不为空。

我们在组件构造函数中设置了自定义验证器，以