Custom Directive is not working in Angular 16

Question

I have tried all of the way, but i missed something i think.

I want a result of calling the directice on load for my new datepicker field. I am doing this for a custom date picker field.

import { Directive, ElementRef, AfterViewInit, OnInit, Input, Output, EventEmitter } from '@angular/core';

@Directive({
    selector: '[datePickerDir]',
})

export class DatePickerDirective implements OnInit {

    constructor() {
    }

    ngOnInit(): void {
        console.log('This is not triggering on load');
    }
}

TIA.