title: Angular the reactive form,it initialization is not verified
body: <p>Angular the reactive form,its initialization is not verified.
  My code:</p>
  
  <pre><code> this.user = new FormGroup({
        category: new FormControl(''),
        // tslint:disable-next-line:max-line-length
        id: new FormControl(''),
        phone: new FormControl('', [Validators.required, Validators.pattern(/^1[0-9]{10}$/)]),
        name: new FormControl('', [Validators.required]),
        // tslint:disable-next-line:max-line-length
        idCard: new FormControl('', [Validators.pattern(/(^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$)|(^[1-9]\d{5}\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{2}$)/)]),
        code: new FormControl('', [Validators.required])
      });
    }
  </code></pre>
  
  <p>The effect now is：
              <a href="https://i.stack.imgur.com/CncGM.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/CncGM.png" alt="enter image description here"></a></p>
  
  <p>I mean, the checksum rule is not executed when the form is first rendered.
    Please help me, thank you.</p>