Tried several times to download the images but nothing pops up in the System 10 / Edge /Download/ folder???
Down loaded other whole Courses from Pluralsight... "Angular Unit Testing" and "Angular Getting Started"
AVG Anti-Virus doesn't see to be blocking it (at least not reporting it?)
There is a flash at the bottom of the screen - where downloads usually appear - but can't see what it is saying/doing

I have been "religiously" keeping up with building out the sample web app in the ng-fundamentals project here. After completing "Lazy Loading Feature Modules" in section 6, I should have a functioning new module that loads when clicking the "Welcome, John" link in the navbar. However, after completing this section (and double and triple checking that I didn't make any obvious mistakes), my app fails to even load anymore with the following message:

Failed to compile.

No NgModule metadata found for 'UserModule'.

I'm new to Angular but not to coding. In looking through browser console, I'm unable to find any better insight into the problem, and Visual Studio Code is showing no issues in my files.

Any help in troubleshooting would be greatly appreciated. Thanks!

-D

Hi I need help,

After pasting in package.json and package-lock.json from your repo, and npm run start I got:

here is my CLI version:

Hi there,

I'm creating ModalTriggerDirective ,have followed each and every bit of the course.When trying to open dialog box on click of search button.I get this error.Please help :(.

Have created JQ_TOKEN and imported the service in the directive.
app.module.ts
let jQuery: any;
{provide: JQ_TOKEN, useValue: jQuery}

I have taken all steps on the pluralsight, but now I have this error.

This site can’t be reachedlocalhost refused to connect.
Search Google for localhost 4200
ERR_CONNECTION_REFUSED

This is the error I get on GitBash

$ ng s --port 4200
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
Browserslist: caniuse-lite is outdated. Please run next command npm update caniuse-lite browserslist

Error: ./node_modules/@angular/router/ivy_ngcc/fesm2015/router.js 43:12
Module parse failed: Identifier 'ɵngcc0' has already been declared (43:12)
File was processed with these loaders:

• ./node_modules/@angular-devkit/build-angular/src/babel/webpack-loader.js
• ./node_modules/@ngtools/webpack/src/ivy/index.js
  You may need an additional loader to handle the result of these loaders.
  | import * as ɵngcc0 from '@angular/core';
  | import * as ɵngcc1 from '@angular/common';

import * as ɵngcc0 from '@angular/core';
| import * as ɵngcc1 from '@angular/common';
| class RouterEvent {

I am following this course on Pluralsight. But I seem not to progress thanks to a failure for Boostrap styles to apply. Any help

I followed along in the Creating Reusable Angular Services: Creating Your First Service

My code matched the modifications made in the video, however, my page would not render and I received the error about the parameters not resolving for EventListComponent.

I tried out the Plunker exercise, and the expected list of events rendered as expected.

In my own project, I had to modify the service code with the the forwardRef method:

`import { Component, OnInit, Inject, ForwardRefFn, forwardRef } from '@angular/core';
import { EventService } from '../shared/event.service';

@component({
selector: 'events-list',
templateUrl: 'events-list.component.html'
})
export class EventsListComponent implements OnInit {
events: any[];
constructor(@Inject(forwardRef(() => EventService))private eventService: EventService) {

}

ngOnInit() {
this.events = this.eventService.getEvents();
}
}

const EVENTS = ...`

the page is rendering, but it seems like a kludge that injects the service into the component.

My other code is as follows:
app.module.ts
`import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { EventsAppComponent } from './events-app.component';
import { EventsListComponent } from './events/events-list.component';
import { EventThumbnailComponent } from './events/event-thumbnail.component';
import { NavBarComponent } from './nav/navbar.component';
import { EventService } from './shared/event.service';

@NgModule({
declarations: [
EventsAppComponent,
EventsListComponent,
EventThumbnailComponent,
NavBarComponent
],
imports: [
BrowserModule
],
providers: [
EventService
],
bootstrap: [EventsAppComponent]
})
export class AppModule { }`

As I said, in Plunker I registered the service without issue in the NgModule declaration. I followed the instructions at the beginning of the course to make sure my ngmodule versions matched what was used in the course. I am confused why this is failing to compile locally.

Let me know if anymore information is needed.

Thanks,
Brent

I am able to successfully compile the code in VS Code but I am getting this strange error in the browser console. Any suggestion? Am I missing anything here?

compiler.js:2193 Uncaught Error: Can't resolve all parameters for EventsListComponent: (?).
at syntaxError (compiler.js:2193)
at CompileMetadataResolver._getDependenciesMetadata (compiler.js:17643)
at CompileMetadataResolver._getTypeMetadata (compiler.js:17539)
at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:17168)
at CompileMetadataResolver.loadDirectiveMetadata (compiler.js:17031)
at compiler.js:24236
at Array.forEach ()
at compiler.js:24235
at Array.forEach ()
at JitCompiler._loadModules (compiler.js:24232)

You can consider the EVENTS has some hardcoded values in it.

event.service.ts:

import { Injectable } from "@angular/core";

@Injectable()
export class EventService {
  getEvents() {
    // tslint:disable-next-line: no-use-before-declare
    return EVENTS;
  }
}

events-list.component.ts

import { Component, OnInit } from "@angular/core";
import { EventService } from "./shared/event.service";

@Component({
  selector: "events-list",
  template: `
    <div>
      <h1>Upcoming Angular Events</h1>
      <hr />
      <div class="row">
        <div *ngFor="let event of events" class="col-md-5">
          <event-thumbnail [event]="event"></event-thumbnail>
        </div>
      </div>
    </div>
  `
})
export class EventsListComponent implements OnInit {
  events: any[];
  constructor(private eventService: EventService) {}

  ngOnInit() {
    this.events = this.eventService.getEvents();
  }
}

app.module.ts

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";

import { EventsAppComponent } from "./events-app.component";
import { EventService } from "./events/shared/event.service";
import { EventsListComponent } from "./events/events-list.component";
import { EventThumbnailComponent } from "./events/event-thumbnail.component";
import { NavBarComponent } from "./nav/nav-bar.component";

@NgModule({
  imports: [BrowserModule],
  declarations: [
    EventsAppComponent,
    EventsListComponent,
    EventThumbnailComponent,
    NavBarComponent
  ],
  providers: [EventService],
  bootstrap: [EventsAppComponent]
})
export class AppModule {}

Module 14 Lesson 3 Moving Data Storage to the Server

• Expected an HTTP response with event data from the remote server through the api

Getting Error:
HttpErrorResponse {headers: HttpHeaders, status: 404, statusText: "Not Found", url: "http://localhost:4200/api/events", ok: false, …}

proxy.conf.json
{ "/api": { "target": "http://localhost:8808", "secure": false } }

package.json
"scripts": { "start": "ng serve --proxy-config proxy.conf.json", },

event.service.ts
getEvents(): Observable<IEvent[]> { return this.http.get<IEvent[]>('/api/events') .pipe(catchError(this.handleError<IEvent[]>('getEvents', []))) }

private handleError<T>(operation = 'operation', result?: T) { return (error: any): Observable<T> => { console.error(error) return of(result as T) } }

At section 6, Lazily Loading Feature Modules.
Just added to routes.ts:
{ path: 'user', loadChildren: './user/user.module#UserModule' }

Full export is:

export const appRoutes: Routes = [
{ path: 'events/new', component: CreateEventComponent, canDeactivate: ['canDeactivateCreateEvent'] },
{ path: 'events', component: EventsListComponent, resolve: { events: EventListResolver } },
{ path: 'events/:id', component: EventDetailsComponent, canActivate: [EventRouteActivator] },
{ path: '404', component: Error404Component },
{ path: '', redirectTo: '/events', pathMatch: 'full' },
{ path: 'user', loadChildren: './user/user.module#UserModule' }
];

But will not compile. Get:
Cannot read property 'loadChildren' of undefined

Hi Just encountered this error while doing some routing, i was planning to have my child page to be accessible and this happened.

Don't know what was the cause of this, after the Interface creation it seems that this happened but i think that the creation of interface would affect the routing part

please help

Course location: Routing and Navigating Pages section, Adding Your First Route subsection

It's possible (likely?) I did not adhere to the package version lock downs, but I needed to import the FormsModule to use event-details.component.html.

https://stackoverflow.com/questions/39559296/there-is-no-directive-with-exportas-set-to-ngform

Great course, thanks!