ANGULAR Issue & Solutions

Category:Angular 6

Issue 1:

When i execute ng g component dummypage , then it is showing following error More than one module matches. Use skip-import option to skip importing the component module.


SOLUTION:

ng g component dummypagetest --skip-import


Category:Angular 6

Issue 2:

When you deploy angular6 compiled files to .net server.for eg:-Client project:Angular6project DOTNet project:TestWebAPI.
It throws following error:
/styles.3ff695c00d717f2d2a11.css:1 Failed to load resource: the server responded with a status of 404 (Not Found) /runtime.932554c7e1000ee910b0.js:1 Failed to load resource: the server responded with a status of 404 (Not Found)


SOLUTION:

Go to index.html of .net web api project, and replace the above files with project name like this
<head>
<link rel='stylesheet' href='/TestWebAPI/styles.3ff695c00d717f2d2a11.css'>
<head>
<script type='text/javascript' src='/TestWebAPI/runtime.932554c7e1000ee910b0.js>
Now the index.html will show the output in correct path


Category:Angular 6/8

Issue 3:

Unhandled Promise rejection: StaticInjectorError(AppModule)[HttpClient]:
StaticInjectorError(Platform: core)
[HttpClient]: NullInjectorError: No provider for HttpClient! ; Zone:
Task: Promise.then ; Value: Error: StaticInjectorError(AppModule)
[HttpClient]:
StaticInjectorError(Platform: core)[HttpClient]:
NullInjectorError: No provider for HttpClient!


SOLUTION:

Go to app.module.ts and add following lines
import {HttpClient,HttpClientModule} from '@angular/common/http';
@NgModule({
imports: [
HttpClientModule]
})


Issue 4 :-
when router-outlet is included in app.component.html with other html elements like div,paragraph etc.
Now run ng serve in command prompt.
After executing the site i saw,the output is blank.
for eg:- app.component.html
<div style='text-align:center'>
<h1>
welcome to Technology
<h1>
<h2>hello angular6'<h2>'
<div>
SOLUTION:-
ADD CUSTOM_ELEMENTS_SCHEMA IN APP.MODULE.TS
import { NgModule,CUSTOM_ELEMENTS_SCHEMA } from @angular/core;
@NgModule({
schemas: [CUSTOM_ELEMENTS_SCHEMA],
declarations: [
AppComponent
],
NOW AFTER RUNNING NG SERVE,YOU CAN SEE THE OUTPUT IN THE BROWSER.