在@Angular/flex布局中使用ObservaleMedia从角度7移动到8

我有几个问题无法解决

原始代码段：

import { map } from 'rxjs/operators';
import { ObservableMedia } from '@angular/flex-layout';

…..export class MyClass {

readonly breakpointsToColumnsNumber = new Map([
    ['xs', 1],
    ['sm', 2],
    ['md', 3],
    ['lg', 4],
    ['xl', 5],
  ]);

constructor(private media: ObservableMedia ) {
  this.columns$ = this.media.asObservable().pipe(map(mc => <number>this.breakpointsToColumnsNumber.get(mc.mqAlias)));

}

现在我有两个错误：

声明新映射：找不到“映射”。是否需要更改目标库？尝试将

lib

编译器选项更改为es2015或更高版本。（在我的tsconfig文件中，我将'lib'设置为es2017和dom，但即使添加es2015也不会删除它

第二个错误出现在Lambda mc.mqAlias上：类型“MediaChange[]”上不存在属性“mqAlias”-查看新对象时，我看不到与此等效的任何内容。

1个错误： 你可能失踪了

lib.es2015.collection.d.ts

文件保存在lib文件夹中

第二个错误： 在这种情况下，asObservable（）方法将MediaChange[]类型传递到

mc

。为了访问mqAlias属性，您需要确保

mc

类型为MediaChange。您可以使用media$而不是asObservable（）。 您的代码可能最终看起来像这样：

从“@angular/flex布局”导入{MediaObserver}；
...
构造函数（专用媒体：MediaObserver）{
this.columns$=this.media.media$.pipe（映射（mc=>this.breakpointstocolumnsumber.get（mc.mqAlias））；
}

由于media$映射到MediaChange[]数组中的第一项，因此您也可以使用以下代码：

this.columns$=this.media.asObservable（）
.烟斗(
映射（mc=>this.breakpointstocolumnsumber.get（mc[0].mqAlias））
);

import { MediaObserver } from '@angular/flex-layout';

constructor(private media: MediaObserver)…