angular - startWith ('' ) typescript 代码有什么作用?

标签 angular typescript angular-material angular-material-5

我正在使用 Typescript 学习 Angular 5。我正在尝试实现一个 Angular Material 自动完成功能,我发现以下代码对我来说非常晦涩:

this.filteredStates = this.stateCtrl.valueChanges
  .pipe(
    startWith(''),
    map(state => state ? this.filterStates(state) : this.states.slice())
  );

完整代码可以在这里找到:https://stackblitz.com/angular/mdokmnyajmd?file=app%2Fautocomplete-overview-example.ts

我倾向于认为,当 stateCtrl 发生变化时,当且仅当在自动完成中选择了具体元素时,它才会返回 filterStates(state) 结果。

我不明白的是 startWith('') 的用法?!为什么不简化对 valueChanges 的调用订阅?

最佳答案

valueChanges 最初不会发出任何值(直到状态实际改变)。当您需要从初始状态计算某些内容时,您可以使用 startWith 使 observable 发出一个值,即使它通常不会发出。

如果你想在没有startWith的情况下处理初始值,你可以创建另一个流

Observable.of(stateCtrl.value).pipe(
  map(state => state ? this.filterStates(state) : this.states.slice())
);

它只会发出一个值。但是同时处理这两种情况更容易,所以 startWith 是一个很好的方法......

关于angular - startWith ('' ) typescript 代码有什么作用?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48465361/

相关文章:

Angular 2组件多态性

html - Angular 4 动画正确地左、右、上、下,但不适用于转换(translateX、translateY、translateZ)

typescript - TypeScript 有 toString() 版本吗

css - 选择时如何更改从 Material ui中选择的背景颜色?

typescript - 在 src 目录中创建 React App (TypeScript) 自动生成 react-app-env.d.ts

Angular Material 使用颜色选择器设置主题颜色

Angular 5 snackbar 通知

angular - Http.post 错误 : map is not a function in Angular 2

angular - ng 服务无法编译

html - 删除 Angular Material slider 幻灯片上的强调色