andrewarosario

@Component({
  selector: "my-app",
  template: `
    <div class="container">
      <div>Digite sua nota:</div>
      <textarea [formControl]="note" class="note-input"></textarea>
      <div class="save-indicator">{{ saveIndicator$ | async }}</div>
    </div>
  `,
  styleUrls: ["./app.component.css"]

andrewarosario

export class AppComponent {
  note = new FormControl("");
  saveIndicator$ = of("Todas as mudanças foram salvas");

  ngOnInit() {
    const inputToSave$ = this.note.valueChanges.pipe(
      debounceTime(300),
      distinctUntilChanged(),
      share()
    );

andrewarosario

export class AppComponent {
  note = new FormControl("");
  saveIndicator$ = of("Todas as mudanças foram salvas");
  saveCount = 0;

  ngOnInit() {
    const inputToSave$ = this.note.valueChanges.pipe(
      debounceTime(300),
      distinctUntilChanged(),
      share()

andrewarosario

export class AppComponent {
  note = new FormControl("");
  saveIndicator$: Observable<string>;
  saveCount = 0;

  ngOnInit() {
    const inputToSave$ = this.note.valueChanges.pipe(
      debounceTime(300),
      distinctUntilChanged(),
      share()

andrewarosario

export class AppComponent {
  note = new FormControl("");
  saveIndicator$: Observable<string>;
  saveCount = 0;

  ngOnInit() {
    const inputToSave$ = this.note.valueChanges.pipe(
      debounceTime(300),
      distinctUntilChanged(),
      share()

andrewarosario

@Component({
  selector: 'app-user-detail',
  templateUrl: './user-detail.component.html',
})
export class UserDetailComponent {

  public userId$ = this.route.paramMap.pipe(map(params => params.get('id')));

  constructor(private route: ActivatedRoute) {}
  

andrewarosario

@Component({
  selector: 'app-user-detail',
  templateUrl: './user-detail.component.html',
  providers: [ ROUTE_ID_PROVIDERS ]
})
export class UserDetailComponent {

  constructor(
    @Inject(ROUTE_ID) public userId$: Observable<string>
  ) {}

andrewarosario

export const ROUTE_ID = new InjectionToken<Observable<string>>(
  'Returns an observable in the route id being passed as a parameter',
);

export function routeIdFactory(route: ActivatedRoute): Observable<string> {
    return route.paramMap.pipe(map(params => params.get('id')));
}

export const ROUTE_ID_PROVIDERS: Provider[] = [
    {

andrewarosario

export const USER_DETAIL = new InjectionToken<Observable<User>>(
    'A stream with current user detail'
);

export const USER_PROVIDERS: Provider[] = [
    {
        provide: USER_DETAIL,
        deps: [ActivatedRoute, UserService],
        useFactory: userFactory,
    },

andrewarosario

@Component({
  selector: 'app-todo-list',
  templateUrl: './todo-list.component.html',
  styleUrls: ['./todo-list.component.css'],
  changeDetection: ChangeDetectionStrategy.OnPush
})
export class TodoListComponent implements OnInit {
  public todos$: Observable<Todo[]>;
  public searchForm = new FormControl('');