Skip to content

Instantly share code, notes, and snippets.

@bernardo-cs
Last active September 11, 2017 13:18
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save bernardo-cs/5a4a6fafa568b31287f60131eb4754d1 to your computer and use it in GitHub Desktop.
Save bernardo-cs/5a4a6fafa568b31287f60131eb4754d1 to your computer and use it in GitHub Desktop.
Angular 2 direct, make content editable only for admins
import { AfterViewInit, Directive, ElementRef, HostListener, Input } from '@angular/core';
import { UserService } from '../shared/services/user.service';
@Directive({
selector: '[flEditable]'
})
export class EditableDirective implements AfterViewInit {
@Input('endpoint') endpoint;
constructor(private el: ElementRef, private userService: UserService) { }
ngAfterViewInit(): void {
this.userService.isAdmin$
.subscribe(x => this.el.nativeElement.contentEditable = x);
}
@HostListener('blur')
log() {
this.endpoint(this.el.nativeElement.innerText).subscribe();
}
}
// Usage:
// <span class="print-hidden" flEditable
// [endpoint]="updateBulletinSubTitle">{{bulletin.subtitle}}</span>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment