After successfully installing PrimeNg, I encountered an error while using the p-autoComplete
component. Despite my efforts to troubleshoot and replicate an official demo from PrimeNg, the issue persists.
In order to install PrimeNg, I followed these steps:
npm install primeng --save
npm install primeicons --save
Next, I added the module to my app.component.ts
file like so:
import { AutoCompleteModule } from 'primeng/autocomplete';
//other imports
@NgModule({
declarations: [
AppComponent,
HomeComponent
],
imports: [
BrowserModule,
AutoCompleteModule
],
providers: [CountryServiceService],
bootstrap: [AppComponent]
})
export class AppModule { }
I then created a service with sample code from PrimeNg's website and added it to my application using Angular CLI.
The service was integrated into my app.component.ts
file as shown below:
import { CountryServiceService } from './country-service.service';
...
providers: [CountryServiceService],
...
Additionally, I created a new component called home and copied the official demo code from the PrimeNg website directly into the home.component.html
file.
The corresponding TypeScript code for the home component was also replicated from PrimeNg's website.
To test everything, I included the home component in my app.component.html
.
Despite following these steps meticulously, I am still unable to render the desired output on the HTML page. Upon inspecting the page, I came across the following errorhttps://i.sstatic.net/p59pg.png.
At this point, I'm at a loss as to what could potentially be wrong. It seems like even when sticking closely to the official documentation, I can't seem to get it right. Frustrating encounters with PrimeNg indeed!