skip to Main Content

I cannot find the exact problem. WebStorm highlights CommonModule directives even if the BrowserModule was provided. Below you can see my app.module and app.component.html. But it seems that everything is okay, because the app compiles correctly. There is no any problem highlighted in the Visual Studio Code.

If I point this error, it says:

Property ngIf is not provided by any applicable directive on an embedded template.

app.module

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

app.component.html (here I get this highlights)

<h1 *ngIf="true">Title</h1>

My packages:

- @angular-devkit/architect       0.1601.0
- @angular-devkit/build-angular   16.1.0
- @angular-devkit/core            16.1.0
- @angular-devkit/schematics      16.0.6
- @angular/cli                    16.0.6
- @schematics/angular             16.0.6
- rxjs                            7.8.1
- typescript                      5.0.4

I tried to invalidate WebStorm caches, also I’ve created a new application and checked if this highlights appears (same situation).

It makes me mad, please help me to figure out this question.

2

Answers


  1. Chosen as BEST ANSWER

    The solution was pretty easy :D I just has to update Webstorm (to 2023.2 EAP v)


  2. The angular structural directives are in the angular common module so that is the one you need to import.

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search