Angular 使用formBuilder显示模板中maxLength规则的字符数

我正在尝试验证文本字段的最大长度是否为“x”值。我希望此消息从视图中动态显示

this.register= this.formBuilder.group({
 cellphone:[
  null,
  Validators.compose([Validators.required, Validators.maxLength(50)])
]
})

例如：

<div *ngIf="this.register.get("cellphone").hasError('maxlength')">
(maxlength is: {{}} digits);
</div>

（maxlength为：{{}}位）；

我怎么做？ 我需要知道规则的价值。如果我定义文本字段的maxlength为5，我希望在视图中动态地获得这5。5可能会有所不同，因此我希望动态地执行此操作：例如，使用变量

minlength

组件

minlength = 5;
username = new FormControl('', [ Validators.required, Validators.minLength(this.minlength)]);

loginForm: FormGroup = this.builder.group({
    username : this.username 
});

HTML

<form [formGroup]="loginForm" (ngSubmit)="login()">
    <input  type="text" name="username" id="username" [formControl]="username">

<div [hidden]="username.valid || username.untouched">
  <div>
    The following problems have been found with the username:
  </div>

  <div [hidden]="!username.hasError('minlength')">
    Username can not be shorter than {{ minlength }} characters.
  </div>
  <div [hidden]="!username.hasError('required')">
    Username is required.
  </div>
</div>

</form>

发现用户名存在以下问题：
用户名不能短于{{minlength}}个字符。
用户名是必需的。

你可以激发它来创建你的手机表单。

如果你有类似的想法

    this.myform3=this.fb.group({
      item:['',Validators.maxLength(10)]
    })

<div *ngIf="myform3"  [formGroup]="myform3">
  <input formControlName="item">
  <div *ngIf="myform3.get('item').errors?.maxlength">
     <pre>{{myform3.get('item').errors|json}}</pre>
  </div> 
</div>

this.myform3=this.fb.group({
项目：[''，验证器。最大长度（10）]
})
{{myform3.get（'item'）.errors | json}

您可以在myform3.get（'item'）.errors？.maxlength.requiredLength中看到所需的长度，在myform3.get（'item'）.errors？.maxlength.actualLength中看到实际的长度，以便您可以写入

最大长度为{myform3.get（'item'）。错误？.maxlength.requiredLength}
然后写{myform3.get（'item'）.errors？.maxlength.actualLength}}个字符

---

提示：如果对象无效，所有验证程序都会返回一个对象。您可以检查返回对象，如示例中所示。因此，如果我们编写自己的自定义验证器，我们会让它返回一个具有代表性的对象

您尝试过实现它吗？你发现了什么问题？你能提供一个？@bracco23是的朋友，我当然试过了，但我不知道如何获取我在规则中实现的maxlength的值。我只是错过了这个。谢谢，我在这一点上。但我需要知道规则的价值。如果我定义文本字段的maxlength为5，我希望在视图中动态地获得这5。5可能会有所不同，所以我想动态地做。你太善良和聪明了，非常感谢你的努力。但我不知道这是否让我明白，但我的意思是直接从我定义的规则中获得值？我不想每次我想得到那个值时总是定义一个变量，谢谢你的夸奖。但据我所知，没有办法读取验证器。这意味着我们无法获取值

minlength

。有一张票是从那个角度开出的。你可以看到，看到我的答案

  <div *ngIf="myform3.get('item').errors?.maxlength">
    the max length is {{myform3.get('item').errors?.maxlength.requiredLength}} 
    and you write {{myform3.get('item').errors?.maxlength.actualLength}} characteres
 </div>