ndcunningham

const example1$ = from(people).pipe(map(person => person.house.street));

const example2$ = from(people).pipe(pluck('house', 'street'));

ndcunningham

pay$ = defer(() => fromEvent(button, 'click')).pipe(
  mergeMap(() => this.payService.pay()
  // This will make the above fire multiple times regardless if there is one currently running
);

ngOnInit() {
  this.pay$.subscribe()
}

ndcunningham

start() {  
  documentSubscription$ = fromEvent(document, 'click').subscribe();
  // this is our addEventListener
}

done() {
  this.documentSubscription$.unsubscribe();
  // this is our removeEventListener
}

ndcunningham

@ViewChild('button', {static: true }) buttonElement: ElementRef<HTMLButtonElement>; 
clicks$ = defer(() => fromEvent(this.buttonElement.nativeElement, "clicks")).pipe(
  map(() => new Date().toString()),
  tap(console.log)
);


ngOnInit() {
  this.clicks$.subscribe();
  // Works!

ndcunningham

@ViewChild('button', {static: true }) buttonElement: ElementRef<HTMLButtonElement>; 
clicks$ = fromEvent(this.buttonElement.nativeElement, "click").pipe(
  map(() => new Date().toString()),
  tap(console.log)
);


ngOnInit() {
  this.clicks$.subscribe();
  // ERROR

ndcunningham

const example1$ = from(people).pipe(map(person => person.name));

const example2$ = from(people).pipe(pluck('name'));

ndcunningham

const people: Array<Person> = [
  {
    name: 'Jill',
    house: {
      street: RxJs Street,
      number: 20,
      size: 1100
    }
  },
  {

ndcunningham

export interface Person {
  name: string;
  house: House;
}

export interface House {
  street: string;
  number: number;
  size: number;
}

ndcunningham

  getProductIfExist$ = (productId: string) => {
    return this.store
      .select(fromProduct.getProductById(productId))
      .pipe(filter(product => !!product));
  };

  getProductFromApi$ = (id: string) =>
    this.getProductIfExist$(id).pipe(
      filter(product => !product),
      switchMap(() => this.productService.getProduct(id))

ndcunningham

@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {

  @ViewChild('dropZone', { static: true }) dropZone: ElementRef<HTMLDivElement>;

  dragEnter$ = defer(() => fromEvent(this.dropZone.nativeElement, 'dragenter')).pipe(