Ionic 2 - Ripple effect manually

As I see by sources of Ionic v3.3, a container element must contain an empty div element with button-effect class, also the container must have tappable attribute and be styled as position: relative; overflow: hidden.

In my project I use a following directive to style button-like containers:

import {Directive, ElementRef, Host, Renderer2} from '@angular/core';

@Directive({
    selector: '[m-ripple-effect]',
    host: {
        'tappable': '',
        'role': 'button',
        'style': 'position: relative; overflow: hidden'
    }
})
export class RippleEffectDirective {
    constructor(@Host() host: ElementRef, renderer: Renderer2) {
        const div = renderer.createElement('div');
        renderer.addClass(div, 'button-effect');
        renderer.appendChild(host.nativeElement, div);
    }
}