/Javascript/AngularJS/Angular add debounce time before putting valu in subject next

Angular add debounce time before putting valu in subject next

import {Component}   from '@angular/core';
import {FormControl} from '@angular/forms';
import {Observable}  from 'rxjs/Observable';
import 'rxjs/add/operator/debounceTime';
import 'rxjs/add/operator/throttleTime';
import 'rxjs/add/observable/fromEvent';

@Component({
  selector: 'my-app',
  template: `<input type=text [value]="firstName" [formControl]="firstNameControl">
    <br>{{firstName}}`
})
export class AppComponent {
  firstName        = 'Name';
  firstNameControl = new FormControl();
  formCtrlSub: Subscription;
  resizeSub:   Subscription;
  ngOnInit() {
    // debounce keystroke events
    this.formCtrlSub = this.firstNameControl.valueChanges
      .debounceTime(1000)
      .subscribe(newValue => this.firstName = newValue);
    // throttle resize events
    this.resizeSub = Observable.fromEvent(window, 'resize')
      .throttleTime(200)
      .subscribe(e => {
        console.log('resize event', e);
        this.firstName += '*';  // change something to show it worked
      });
  }
  ngDoCheck() { console.log('change detection'); }
  ngOnDestroy() {
    this.formCtrlSub.unsubscribe();
    this.resizeSub  .unsubscribe();
  }
}

Source: stackoverflow.com

Similar codes

10 votes193 views3 answers
Pipe of date angular
Javascript AngularJS
2 votes174 views2 answers
Angular display block
Javascript AngularJS
1 vote201 views1 answer
What is the best way to conditionally apply attributes in AngularJS?
Javascript AngularJS
18 votes225 views2 answers
Check angular version
Javascript AngularJS
139 votes360 views6 answers
Angular cli
Javascript AngularJS
8 votes186 views3 answers
Angular [routerlink]
Javascript AngularJS
2 votes197 views2 answers
Angular size of array
Javascript AngularJS
0 vote185 views3 answers
Input on change angular 2
Javascript AngularJS
1 vote203 views1 answer
Angularjs change route js
Javascript AngularJS
3 votes202 views1 answer
Send event to child component angular
Javascript AngularJS