Skip to content

Instantly share code, notes, and snippets.

@codef0rmer
Created February 26, 2019 18:02
Show Gist options
  • Save codef0rmer/ac52e3ff88e692b850dec9b1e46095ae to your computer and use it in GitHub Desktop.
Save codef0rmer/ac52e3ff88e692b850dec9b1e46095ae to your computer and use it in GitHub Desktop.
import {
Component,
ElementRef,
OnInit,
ViewChild,
Input,
Renderer2,
ChangeDetectionStrategy,
NgZone
} from '@angular/core';
declare const $: any;
@Component({
selector: 'app-toolbar-legends',
template: `
<div #el class="btn-toolbar {{class}}">
<i class="fa {{icon || 'fa-cog'}}"></i>
</div>
<ng-content></ng-content>
`,
changeDetection: ChangeDetectionStrategy.OnPush
})
export class LegendsComponent implements OnInit {
constructor(private renderer: Renderer2, private ngZone: NgZone) {}
@Input() class: string;
@Input() icon: string;
@Input() toolbarConfig: object;
@ViewChild('el', { read: ElementRef }) el: ElementRef;
ngOnInit() {
this.ngZone.runOutsideAngular(() => {
const contentId = Math.random().toString(36).substr(2, 9);
this.renderer.setProperty(this.el.nativeElement.nextElementSibling, 'id', contentId);
this.toolbarConfig['content'] = `#${contentId}`;
$(this.el.nativeElement).toolbar(this.toolbarConfig);
});
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment