Skip to content

Instantly share code, notes, and snippets.

@nom3ad
Forked from anhkind/rerender.directive.ts
Created May 15, 2022 17:35
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 nom3ad/7773a1eeaf430a335297a056b7374897 to your computer and use it in GitHub Desktop.
Save nom3ad/7773a1eeaf430a335297a056b7374897 to your computer and use it in GitHub Desktop.
Angular directive to re-render a template if it detects any changes of the input
/**
* Example:
*
* <ng-container *rerender='changingInput'>
* this content will be re-rendered everytime `changingInput` changes
* </ng-container>
*/
import { Directive,
Input,
TemplateRef,
ViewContainerRef } from '@angular/core';
@Directive({
selector: '[rerender]'
})
export class RerenderDirective {
constructor(
private templateRef: TemplateRef<any>,
private viewContainer: ViewContainerRef
) {}
// if detects changes of the input `val`, clear and rerender the view
@Input() set rerender(val) {
this.viewContainer.clear();
this.viewContainer.createEmbeddedView(this.templateRef);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment