unicorn-components/src/directives/autofocus.directive.ts

<a target="_blank" href="https://getunicorn.io"><img src="https://bitbucket-assetroot.s3.amazonaws.com/c/photos/2017/Jul/07/2615006260-5-nitsnetsstudios-ondemand-UNI_avatar.png" align="left"></a>

import { Directive, ElementRef, Input, OnInit, Renderer } from '@angular/core';

@Directive({
    selector: '[autofocus]'
})
export class UniAutofocusDirective implements OnInit {
    @Input() autofocus = false;

    constructor(
        private elementRef: ElementRef,
        private renderer: Renderer
    ) { }

    ngOnInit() {
        const elm = this.elementRef.nativeElement;
        if (this.autofocus) {
            this.renderer.invokeElementMethod(elm, 'focus', []);

            /* Hack to prevent Firefox put the cursor at the beggining of the input */
            const value = elm.value;
            elm.value = '';
            elm.value = value;
        }
    }
}