This repo contains a few helper files for the Angular Fundamentals course at http://app.pluralsight.com/courses/angular-fundamentals
angular-fundamentals-files's Introduction
angular-fundamentals-files's People
Forkers
lkruscic joeeames tmustain johcare raycdut preetib2000 veerababukottu aneeshepari thanhatpatolus tmaxnoda scaryjones rishuatgithub sebastiansiebert boomanaveen srikanthpoli jaytarwe roosterroo theonwosu ginhanlabs amolsb sindhu-nv romprokop jaymel-tapel rangareddych crystalcoding jelmerdeboer rykizil dmcarvalho88 deyanju jpcuevas jeromechauveau ryoung3 kalyankrishna1 shradha3394 souraviss rmmcat skgattani turinskiy sreeram313 saddambilalov sivashankar99 chaimoumacj rezaru2000 sam1610 arvindchourasiya 21mooie mathewjustin ceofvo eugenehiggins saratcsss jaleled alexmjung pawaniu iyikuyoro ba-nitel claude-kamaha rishabh2712 tuwizard sliqric7053 diana-stancheva jbisasky megame24 vksantoshsunny rohitreddygaddam megha705 lipsitz annie-huang hallmediadigital piyushkumartrivedi ilanitme manianis link4vets sitaramyadav saidiadegoke abenjamin13 aajmeri jcpoz123 boltosaurus artemis15 manoj79k ddotx manushankar perticoz alexhoneygosky amritmalla suruwa akolliy1 rajavijayach markboyer newbo94 resdenia manelmachado gupta89aman shafeenakabir birchybirch conorkillilea anthonyv1121 rdclder codermaxzhou cofimateangular-fundamentals-files's Issues
ERROR TypeError: _this.$ is not a function
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}
No NgModule metadata found for 'UserModule'.
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
Error: http://localhost:8808 (ECONNREFUSED)
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) } }
Cannot read property 'loadChildren' of undefined
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
Data path "" should NOT have additional properties(es5BrowserSupport)
Problems after write routes
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 {
TypeError: Array.prototype.map: argument is not a Function object
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
Unable to download images for Angular Foundation
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
Failed Boostrap
I am following this course on Pluralsight. But I seem not to progress thanks to a failure for Boostrap styles to apply. Any help
Getting 'Can't resolve all parameters for EventListComponent: (?).
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
localhost:4200 error!
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
FormsModule missing from app.module.ts
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!
Uncaught Error: Can't resolve all parameters for EventsListComponent: (?).
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 {}
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.