alexzuza

<div *ngIf="showHelp"
  class="context-help-dialog"
  (document:click)="documentClicked($event)"
  (window:keydown.Escape)="escapedClicked()"
>
  {{ content }}
</div>

alexzuza

platformBrowser()
  .bootstrapModule(AppModule, { ngZoneEventCoalescing: true });

alexzuza

import { Component, OnInit, Input, ElementRef, HostListener, ViewChild } from '@angular/core';

@Component({
  selector: '[context-help]',
  templateUrl: './context-help.component.html',
  styleUrls: ['./context-help.component.css'],
})
export class ContextHelpComponent {
  @Input('context-help') content: string;

alexzuza

<ng-content></ng-content>

<div class="context-help-container" #container>
	<i (click)="showHelp = true;"></i>
	<div *ngIf="showHelp" class="context-help-dialog">
		{{ content }}
	</div>
</div>

alexzuza

<h3 context-help="Some description 1">Some title 1</h3>

alexzuza

<h2 class="title">Products</h2>

<div class="search-bar">
  <input (input)="searchStream$.next($event.target.value)"> 
</div>
    
<div class="results"> 
  <h3>Built-in solution</h3>
  <div *ngIf="obs$ | async as obs">
    <ng-template [ngIf]="obs.type === 'finish'">

alexzuza

import { Pipe, PipeTransform } from '@angular/core';
import { isObservable, of } from 'rxjs';
import { map, startWith, catchError } from 'rxjs/operators';

@Pipe({
  name: 'withLoading',
})
export class WithLoadingPipe implements PipeTransform {
  transform(val) {
    return isObservable(val)

alexzuza

import { Pipe, PipeTransform } from '@angular/core';
import { isObservable, of } from 'rxjs';
import { map, startWith, catchError } from 'rxjs/operators';

@Pipe({
  name: 'withLoading',
})
export class WithLoadingPipe implements PipeTransform {
  transform(val) {
    return isObservable(val)

alexzuza

static ngTypeCtor<T>(init: Partial<Pick<NgForOf<T>, 'ngForOf'|'ngForTrackBy'|'ngForTemplate'>>): NgForOf<T>;

alexzuza

function _tcb1(ctx: i0.AppComponent) {
  if (true) {
    var _t1 = document.createElement("input");
    _t1.s; // Property 's' does not exist on type 'HTMLInputElement'.
  } 
}