I need to update some HTML elements (element.setAttribute('tabindex', "0")) after the page was loaded (seems that elements are not exists yet during ngOnInit method).

The elements that I am trying to update are related only to specific directive (child) and not to parents' html. Note that this directive is a child of child of child.... Means, the entire HTML is much bigger but the relevant elements that I want to change exist only in the child html.

I am trying to do that using 'AfterContentInit' but I get an error which I am not completely understand how to solve.

The code is something like:

import {Component, Inject, Input, Output, OnInit, EventEmitter, AfterContentInit, AfterViewInit} from 'ng-metadata/core';
.
.
.
export class PrmAdvancedSearch implements OnInit,AfterContentInit,AfterViewInit {
.
.
.
  ngAfterContentInit() {
    console.log("----------------------------------ngAfterContentInit method");
  }

And getting the following error in console log:

Hooks Impl for MyCode:
===================================
You cannot implement AfterContentInit lifecycle, without allowed transclusion.
turn transclusion on within decorator like this: @Component({legacy:{transclude:true}})

If I'll change AfterContentInit to AfterViewInitit will work without the error but seems that the html element still won't be loaded at this point.

I will appreciate any advise here.

Thanks, Mike