components: No provider for Overlay! StaticInjectorError(AppModule)[MatMenuTrigger -> Overlay]:

I also fixed it by importing OverlayModule in my app.module.ts. Importing OverlayModule in lazy-loaded modules by the Router would’t work.

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";

import { OverlayModule } from "@angular/cdk/overlay";

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent,
  ],
  imports: [
    BrowserModule,
    BrowserAnimationsModule,
    OverlayModule,
    AppRoutingModule,
  ],
  providers: [],
  bootstrap: [
    AppComponent,
  ],
})
export class AppModule { }

i am still getting this error, although i have added OverlayModule in the AppModule. i even tried adding them to all the LazyLoad Modules, still no fix

Having similar issue due to [matTooltip]. Project was upgraded to 6 (release)

ERROR Error: StaticInjectorError(AppModule)[CdkConnectedOverlay -> Overlay]: 
  StaticInjectorError(Platform: core)[CdkConnectedOverlay -> Overlay]: 
    NullInjectorError: No provider for Overlay!
    at NullInjector.push../node_modules/@angular/core/fesm5/core.js.NullInjector.get

Hope it helps

After some tests, it appears it’s only happen in v6 when the module where MatAutocomplete is used is lazy-loaded.

What about if importing OverlayModule at the app.module.ts isn’t an option? I am shipping a component as a library that uses material.

Importing OverlayModule at the library.module does not resolve the issue, only if I import it at the app.module of the project that uses my library… this would require the user to perform additional setup instead of just being able to import my library and use it right away,

Is there anyway around this?

StaticInjectorError(Platform: core)[MatMenuTrigger -> Overlay]: 
    NullInjectorError: No provider for Overlay!

import { Overlay } from ‘@angular/cdk/overlay’ in the spec file This fixed the issue for me

Same problem after updating to Angular 8.

Hello,

Although I am late to the post, I am facing the same issue.

I have created a showcase project for a library I’m coding. When using a custom overlay service that I wrote, I faced the error.

Simply providing my service into the module, instead of using providedIn: root solved the issue.

I’m posting that just in case someone encounters the same issue in the same case.

Sorry I bothered you all !

@renatop7 you have right! The only way to get that thing working is to import OverlayModule in the app component (the root) module and not in the lazy loaded module… 🍰

For everyone having problems with the NullInjectorError: No provider for Overlay! when trying to lazy load, just try to add OverlayModule to app.module imports, or your root module, for me it worked like a charm.

It’s a temporary fix until they update the code…

i guess this cause Overlay must provide in root injector.