0

I want to switch from SCAM to angular standalone component design. I started by creating a new component but I keep getting the the error:

class ExpansionTableComponent Appears in the NgModule.imports of SMVHistoryComponentModule, but could not be resolved to an NgModule class.

Is it missing an @NgModule annotation?(-996002)

I'm using following packages:

Angular CLI: 14.2.10
Node: 14.20.0
Package Manager: npm 6.14.17 
OS: linux x64

@angular-devkit/architect          0.1402.10
@angular-devkit/build-angular      14.2.10
@angular-devkit/core               14.2.10
@angular-devkit/schematics         14.2.10
@angular/cdk                       14.2.7
@angular/cli                       14.2.10
@angular/google-maps               14.2.7
@angular/material                  14.2.7
@angular/material-moment-adapter   14.2.7
@schematics/angular                14.2.10
rxjs                               6.6.3
typescript                         4.6.4

This is my component setup:

ExpansionTableComponent:

@Component({
  selector: 'app-expansion-table',
  templateUrl: './expansion-table.component.html',
  styleUrls: ['./expansion-table.component.scss'],
  standalone: true,
  imports: [CommonModule, MatExpansionModule, MatTableModule]
})
export class ExpansionTableComponent implements OnChanges {
  @Input() tableData: ExpansionTableData[];

  ngOnChanges(changes: SimpleChanges): void {
    console.log(this.tableData);
  }
}

And imported it as suggested by the angular guide ([https://angular.io/guide/standalone-components](Angular Standalone Component Guide)) in a SCAM component:

@Component({
  selector: 'app-smv-history',
  templateUrl: './smv-history.component.html',
  styleUrls: ['./smv-history.component.scss'],
  providers: [SMVHistoryService]
})
export class SMVHistoryComponent {}

@NgModule({
  declarations: [SMVHistoryComponent],
  exports: [SMVHistoryComponent],
  imports: [
    CommonModule,
    MatCardModule,
    MatTableModule,
    MatIconModule,
    MatButtonModule,
    MomentModule,
    MatFormFieldModule,
    MatInputModule,
    FormsModule,
    ReactiveFormsModule,
    MatDatepickerModule,
    MatPaginatorModule,
    MatDialogModule,
    ProcessResultDialogComponentModule,
    TranslateModule.forChild(),
    ExpansionTableComponent
  ]
})
export class SMVHistoryComponentModule {}

This builds and the application is working as expected. However I get the following Error in VSCode: VSCode Error

I can't get rid of this error, has anyone an idea on how to fix this?

Hans Völzer
  • 1
  • 1
  • 1
    I think this is not a real error, only VSCode shows you that. Please consider this is kind of a new feature. You maybe von to update your VSCode extensions, so that they can handle the new stuff. – MoxxiManagarm Nov 23 '22 at 10:01
  • Thanks for the hint, I should have seen it on my own.. OK I updated the Angular Language Service Extension and it solved the problem. Maybe this helps someone else. Thank you – Hans Völzer Nov 23 '22 at 11:50
  • Small addition to the solution. For the extension update to work one needs to update the global angular cli version. VSCode seems to set the version of the Angular Extension dependend on that global version. – Hans Völzer Nov 24 '22 at 06:15

0 Answers0