I am attempting to incorporate the ol sidebar from umbe1987/Turbo87 into an Angular project.
As I extend a class, I find myself needing to manipulate constructor parameters in the derived class constructor before passing them to the superclass constructor.
My challenge lies in retrieving a DOM div node from the current Angular component (derivedclass) and passing it as the 'element' argument in the super call.
If I stick with the existing
, the DOM is not rendered by the time the constructor runs.var element = document.getElementById(options.element)Trying
results in the error message:var element = this.mySidebarDiv.nativeElement(options.element)this'super' must be called before accessing 'this' in the constructor of a derived class.ts(17009)
How can I bypass the warning when using the viewChild property (this.mySidebarDiv)? This limitation leads me to pass a
nullelement parameter.Although I know the sidebar won't be rendered until a specific lifecycle hook (ngAfterViewInit), I still need to fetch the DOM element beforehand, within its constructor, to pass it to the superclass constructor. How should I approach this?
Thank you
@Injectable()
export class ProjectInfoSidebarComponent extends Control {
@ViewChild('sidebar') mySidebarDiv: ElementRef;
_container;
_tabitems;
_panes;
_closeButtons;
classList;
_sidebar;
constructor(@Inject(String)opt_options) {
var defaults = {
element: null,
position: 'left'
}, i, child;
var options = Object.assign({}, defaults, opt_options);
//var element = document.getElementById(options.element);
var element = this.mySidebarDiv.nativeElement(options.element)
super({
element: element,
target: options.target
});
// super((() => {
// return {
// element: this.mySidebarDiv.nativeElement.querySelector(options.element),
// target: options.target
// }
// })());
// Attach .sidebar-left/right class
element.classList.add('sidebar-' + options.position);
...
...
...