首页 > 解决方案 > => Angularjs。对于传入的值,我是否正确理解这一点?

问题描述

我正在学习关于 RxJs 6 的 Udemy 课程,并且需要问这个问题,因为这对我来说不是很清楚。

注意:这是我目前正在学习的提前输入教程。所以在 keyup 事件上,这个方法被触发了。

ngAfterViewInit() {
  const searchLessons$ = fromEvent<any>(this.input.nativeElement, 'keyup')
    .pipe(
      map(event => event.target.value),
      debounceTime(400),
      distinctUntilChanged(),
      // switchMap cancels prior calls.
      switchMap(search => this.loadLessons(search))
    );

  const initialLessons$ = this.loadLessons();

  this.lessons$ = concat(initialLessons$, searchLessons$);
}

代码是否意味着,

  1. 对于触发代码的所有事件,将从对loadLessons的已完成调用中收集响应
  2. 事件的值被引用为搜索
  3. 然后 => 将触发对loadLessons(search)的调用
  4. 继续 3:如果事件的值只是说一个值数组,这是否意味着对于 => 调用,将对loadLessons(search)的单独调用将传递给每个单独的数组值
  5. 继续 3: 还是只传入整个数组?

标签: javascriptangulartypescript

解决方案


这是每行解释:

ngAfterViewInit() {
  const searchLessons$ = fromEvent<any>(this.input.nativeElement, 'keyup') // whenever keyup is triggered on this.input
    .pipe(
      map(event => event.target.value), // we extract input value from event target
      debounceTime(400), // we wait for last event in 400ms span
      distinctUntilChanged(), // we check that the input value did change
      switchMap(search => this.loadLessons(search)) // and with that input value changed we call this.LoadLessons and then wait for its return
    );

  const initialLessons$ = this.loadLessons(); // this will call initial loadLeason

  this.lessons$ = concat(initialLessons$, searchLessons$); // this will connect return of initial call and changes triggered by key up this is not secure for race conditions
}

广告1。输入时的所有按键事件

广告2。输入的值被引用为搜索

广告3。是的,它只会将数组作为参数推送


推荐阅读