时间戳

首页 > 解决方案 > Angular：您在预期流的位置提供了一个无效对象。您可以提供 Observable、Promise、Array 或 Iterable

angular - Angular：您在预期流的位置提供了一个无效对象。您可以提供 Observable、Promise、Array 或 Iterable

问题描述

我正在使用我自己的值数组关注 Material autocomplete (with filter) 组件的教程，但我遇到了以下错误。

core.js:1624 ERROR TypeError: You provided an invalid object where a stream was expected. You can provide an Observable, Promise, Array, or Iterable.
    at

我的TS：

games: string[] = ['Title 1', 'Title 2', 'Title 3', 'RPG 1', 'FPS 1', 'MMO'];

  searchTerm = new FormControl();
  filteredGames: Observable<string[]>;

  constructor(private store: Store<fromRoot.State>) { }

  ngOnInit() {
    this.filteredGames = this.searchTerm.valueChanges
      .pipe(
        startWith(''),
        map(value => this._filter(value))
      );
  }

  private _filter(value: string): string[] {
    const filterValue = value.toLowerCase();

    return this.games.filter(option => option.toLowerCase().includes(filterValue));
  }

我的 HTML：

<section class="search" fxLayoutAlign="center center" fxLayout="column">
  <form (ngSubmit)="onSubmit()">
      <mat-form-field class="example-full-width">
        <input type="text" placeholder="Pick one" aria-label="Number" matInput [formControl]="searchTerm" [matAutocomplete]="auto">
        <mat-autocomplete #auto="matAutocomplete">
          <mat-option *ngFor="let option of filteredGames | async" [value]="option">
            {{option}}
          </mat-option>
        </mat-autocomplete>
      </mat-form-field>
    </form>
</section>

我环顾四周，但没有运气。我很困惑，因为我使用的是 Observable。我正在研究 Angular 6。

我也尝试复制整个示例..但我在那里遇到了同样的错误。

标签： angularangular-material

解决方案

有同样的错误，复制粘贴的例子也是如此。我的问题是错误的导入。有：

import {startWith} from "rxjs/internal/operators/startWith";

代替：

import {startWith} from "rxjs/operators";

我希望它可以帮助别人。

推荐阅读