ZackDeRose

export abstract class CarsFacade {
  protected _source: string;

  loaded$       = this.store.select(carsQuery.getLoaded);
  allCars$      = this.store.select(carsQuery.getAllCars);
  selectedCars$ = this.store.select(carsQuery.getSelectedCars);

  constructor(private store: Store<CarsState>) {}

  protected loadAll() {

ZackDeRose

@Injectable()
export class CarsListFacade extends CarsFacade {
  _source = 'Cars List';
  
  constructor(private store$: Store<any>) {
    super(store$);
  }
}

ZackDeRose

describe('Foo Class', () => {
  describe('constructor', () => {
    const fooClassRef = Foo as any; // to pass typechecking
    
    beforeEach(() => {
      console.log(`start of beforeEach: ${fooClassRef._count}`);
      fooClassRef._count = 0;
      console.log(`end of beforeEach: ${fooClassRef._count}`);
    });
    

ZackDeRose

export class Foo {
  private static _count = 0;
  id: number;
  constructor() {
    this.id = ++Foo._count; // starts with 1
  }
}

ZackDeRose

adjustSort(key: string) {
  if (this.sortKey$.value === key) {
    if (this.sortDirection$.value === 'asc') {
      this.sortDirection$.next('desc');
    } else {
      this.sortDirection$.next('asc');
    }
    return;
  }

ZackDeRose

<!-- Hero Name Column -->
<ng-container cdkColumnDef="name">
  <th cdk-header-cell *cdkHeaderCellDef (click)="adjustSort('name')">
    Hero Name
    <span *ngIf="sortKey$.value === 'name'">
      {{ sortDirection$.value === 'asc' ? '↥' : '↧' }}
    </span>
  </th>
  <td cdk-cell *cdkCellDef="let row"> {{row.name}} </td>
</ng-container>

ZackDeRose

combineLatest(this.heroes$, this.searchFormControl.valueChanges, this.sortKey$, this.sortDirection$)
.subscribe(([changedHeroData, searchTerm, sortKey, sortDirection]) => {
  const heroesArray = Object.values(changedHeroData);
  let filteredHeroes: any[];

  if (!searchTerm) {
    filteredHeroes = heroesArray;
  } else {
    const filteredResults = heroesArray.filter(hero => {
      return Object.values(hero).reduce((prev, curr) => {

ZackDeRose

<div class="row">
  <div class="col-6">
    <div class="form-inline">
      <div class="form-group">
        <div class="input-group mr-3">
          <input
            type="text"
            class="form-control"
            placeholder="Search…"
            [formControl]="searchFormControl">

ZackDeRose

combineLatest(this.heroes$, this.searchFormControl.valueChanges)
.subscribe(([changedHeroData, searchTerm]) => {
  const heroesArray = Object.values(changedHeroData);
  
  if (!searchTerm) {
    this.tableDataSource$.next(heroesArray);
    return;
  }

  const filteredResults = heroesArray.filter(hero => {

ZackDeRose

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {CdkTableModule} from '@angular/cdk/table';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';

import {NgbModule} from '@ng-bootstrap/ng-bootstrap';

import { AppComponent } from './app.component';
import { TableComponent } from './table/table.component';