Custom async validators don't work!

Hello, I've been trying to add a async validator to an input with mdbInputDirective (server-side username validation). I'm sure it works, even control's .valid property changes properly. The problem is, the input is still marked in green by the MDB directive. How do I fix this? import { Directive, forwardRef } from "@angular/core"; import { Validator, AbstractControl, NG_ASYNC_VALIDATORS } from "@angular/forms"; import { DynamicValidationService } from "@app/core"; import { timer, from } from "rxjs"; import { switchMap, map, tap } from "rxjs/operators"; @Directive({ selector:"[app-usernameDynamic][ngModel]", providers: [ { provide:NG_ASYNC_VALIDATORS, useExisting:forwardRef(() =>UsernameValidator), multi:true } ] }) export class UsernameValidator implements Validator { constructor(private_serverValidation:DynamicValidationService) {} publicvalidate(c:AbstractControl) { returnthis.validateUsername(c.value); } privatevalidateUsername(username:string) { return timer(300).pipe( switchMap(() => { const validationPromise=this._serverValidation.remoteValidate( "users", "username", { auth: { username: username } } ); return from(validationPromise).pipe( map(valid=> (valid?null: { server: { valid:false } })) ); }), tap(val=>console.log(val)) ); } } <div class="md-form form-group input-group mb-4"> <i class="fa fa-user prefix"></i> <input mdbInputDirectivetype="text"class="form-control"name="username"id="username" (ngModelChange)="authModified = true" data-error="Field invalid"data-success=" " [(ngModel)]="user.auth.username"minLength="5"required app-usernameDynamic> <labelclass="active"for="username">Username</label> </div>

---