Angular mat-select-autocomplete failed to compile error

1
votes
Compiling mat-select-autocomplete : es2015 as esm2015
Compiling select-autocomplete : es2015 as esm2015
Error: Failed to compile entry-point mat-select-autocomplete (es2015 as esm2015) due to compilation errors:
node_modules/mat-select-autocomplete/fesm2015/mat-select-autocomplete.js:310:26 - error NG1010: Value at position 3 in the NgModule.imports of SelectAutocompleteModule 
is not a reference: [object Object]

310                 imports: [
                             ~
311                     FormsModule,
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
...
318                     ReactiveFormsModule,
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
319                 ],
    ~~~~~~~~~~~~~~~~~

Error: Failed to compile entry-point select-autocomplete (es2015 as esm2015) due to compilation errors:
node_modules/select-autocomplete/fesm2015/select-autocomplete.js:247:26 - error NG1010: Value at position 6 in the NgModule.imports of SelectAutocompleteModule is not a reference: [object Object]

247                 imports: [BrowserAnimationsModule, MatFormFieldModule, MatSelectModule, FormsModule, ReactiveFormsModule,
                             ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
248                     MatIconModule, MatCheckboxModule, MatButtonModule],
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

In component.module.ts

import { SelectAutocompleteModule } from 'mat-select-autocomplete';

at NgModule

@NgModule({
imports: [SelectAutocompleteModule]
})

I used npm i mat-select-autocomplete npm install select-autocomplete --save

after that when I run the angular I'm getting above error

how to resolve it ?

3
angularautocompleteangular-materialangular8

3 Answers

1
votes

Did you already try to import it like

import { MatSelectModule } from '@angular/material/select';

... instead?

For more detailed information on Angular 8 Material and how to use it you can have a look here: https://v8.material.angular.io/guide/getting-started

1
votes

It is based on the version

changes in node modules/select-autocomplete/fesm2015/select-autocomplete.js

from

 import { MatButtonModule, MatCheckboxModule } from '@angular/material';

to

import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';```
0
votes

Go to node_modules\mat-select-autocomplete\fesm2015\mat-select-autocomplete.js

Find

import { MatButtonModule, MatCheckboxModule } from '@angular/material';

Replace

import { MatButtonModule } from '@angular/material/button';
import { MatCheckboxModule } from '@angular/material/checkbox';

Done