Topic: MDB5 and Char-Counter

malte premium asked 2 years ago

Currently im switching my project from MDB4 to MDB5. Many fields in my forms used the character counter to display the user the amount of characters left.

I cant find anything like that in MDB5. Is it removed or will be added in later versions?

Arkadiusz Idzikowski staff answered 2 years ago

@malte Such a directive is currently not available in MDB5 Angular but I added it to our to-do list. As a workaround for now you can use this custom solution:


  <input mdbInput [formControl]="input" type="text" id="form1" class="form-control" />
  <label mdbLabel class="form-label" for="form1">Example label</label>
<div>Character count: {{ characterCount }} / {{ maxLength }}</div>


  input = new FormControl();

  characterCount = 0;
  maxLength = 15;

  constructor() {}

  ngOnInit(): void {
    this.input.valueChanges.subscribe(value => {
      this.characterCount = value.length;

Edit: This implementation is now available in the input documentation:

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • ForumUser: Premium
  • Premium support: Yes
  • Technology: MDB Angular
  • MDB Version: MDB5 2.0.0
  • Device: PC
  • Browser: Chrome
  • OS: WIndows 11
  • Provided sample code: No
  • Provided link: No