@Component({
selector: 'searchable-container',
template: `
<ng-content></ng-content>
`
})
export class SearchableContainerComponent {
private searchables: SearchableDirective[] = [];
private searchablesHighlight: SearchableHighlightDirective[] = [];
...
search(searchTerm: string) {
this.handleSearchables(searchTerm);
this.handleHighlighters(searchTerm);
}
register(searchable, { highlight }) {
// add the instance
}
unregister(searchable, { highlight }) {
// remove the instance
}
ngAfterContentInit() {
this.search(this.term);
}
private match(searchable: SearchableDirective) {
return searchable.token.toLowerCase().indexOf(this._term.toLowerCase()) > -1;
}
private handleSearchables(searchTerm: string) {
..same
}
private handleHighlighters(searchTerm: string) {
for (const searchableHighlight of this.searchablesHighlight) {
searchableHighlight.highlight(searchableHighlight.token, searchTerm);
}
}
}