title: How do you read the value of a maxLength validator so that you can print it into the form?
body: <p>I have a reactive form which uses a validator to control the length of the input. </p>
  
  <p>I would like to read that length back again in the template so that I can guide the user as to what the maximum length actually is but I can't figure out how to read it from the form. </p>
  
  <p>Is that possible? </p>
  
  <pre><code>// investor-signup.component.ts
  export class InvestorSignupComponent implements OnInit {
  
    public investorForm = this.fb.group({
      name: ['', [Validators.required, Validators.maxLength(5)]],
      // I want to access be able be able to print the '5' above into the form 
      // without having to duplicate the value or create another variable.
      url: [''],
      type: [''],
    })
  }
  </code></pre>
  
  <pre><code>// investor-signup.component.html
  
  ...
  &lt;input matInput
          formControlName="name"
          required
          placeholder="Startup Capital Inc."&gt;
  
  &lt;mat-hint&gt;Must be less than {{investorForm.name.validators.maxLength.value}} characters long&lt;/mat-hint&gt;
  // note - the investorForm.name.validators.maxLength.value above does NOT work
  </code></pre>
  
  <p>What is the correct way to read this maxLength back out of the FormControl object?</p>
  
  <p>[edit for clarity] 
  I want to read the value out <em>before</em> the user has created the error, not afterwards. This is for telling them what their allowance is rather than that they have an issue.</p>
  
  <p>I'd also like to avoid using a separate variable in order to keep code minimal.</p>