NullInjectorError：没有提供MatBottomSheetRef的提供者

Question

In this stackblitz我遇到以下错误（即使导入了MatBottomSheetModule）：

        ERROR
        Error: StaticInjectorError(AppModule)[CountryCodeSelectComponent -> MatBottomSheetRef]:
        StaticInjectorError(Platform: core)[CountryCodeSelectComponent -> MatBottomSheetRef]:
        NullInjectorError: No provider for MatBottomSheetRef!

有想法吗？

角度/组件功能请求

请对此投票。我要求使用例成为对称的WRT，就像我们如何利用其他类似的Angular组件/服务一样。

https://github.com/angular/components/issues/17011

Answer 1

您需要缺少的“底表”提供程序。

对 material.module.ts

进行这些更改

import {MatBottomSheetRef, MAT_BOTTOM_SHEET_DATA} from '@angular/material/bottom-sheet';

@NgModule({
  exports: [...]
  providers: [
    { provide: MatBottomSheetRef, useValue: {} },
    { provide: MAT_BOTTOM_SHEET_DATA, useValue: {} }
  ],
})

这是针对Webpack进行Treeshaking的推荐方法，以实现更高性能和最小化的包：

在文件中：国家/地区代码select.component.ts

// Removed -1
// import { MatBottomSheetRef } from '@angular/material'; 


//Added +1
import { MatBottomSheetRef} from '@angular/material/bottom-sheet';  

Stackblitz供您参考

https://stackblitz.com/edit/angular-material-baseline2-country-code-select-6hisdk

您已设置好。干杯！