event-list.component.ts file event-thumbnail.component.ts file app.module.ts file
Deploy your Angular app to GitHub pages directly
In this tutorial we’ll see how to host an Angular 6 web application using Github Pages. Let’s get started. Prerequisites You need to have Node.js, NPM and Angular CLI installed, you also need to generate a new Angular 8 project using Angular CLI . Step 1: ng new child-demo in Visual Studio IDE terminal Step…Continue reading Deploy your Angular app to GitHub pages directly
Reading Local JSON Files Using Angular HttpClient
You can use to import JSON files in your Angular application is Angular HttpClient. Let’s see this by example. First, you need to import HttpClientModule in your app. Open the src/app/app.module.ts file and update it as follows: Next, add data.json file to the src/assets folder. Next, open the src/app/app.component.ts file, import and inject HttpClient as follows: Next, open the src/app/app.component.html file Source Code File
Angular Component Interaction – Input Decorator
app.module.ts file app.component.html file app.component.ts file child.component.html file child.component.ts file
Inter Component Interaction Way
Input() Decorator Output() Decorator Getters and Setters ngOnChanges() Template Reference Variables ViewChild() Emitting events Services
Angular Component Interaction – Binding
Binding is basic form of interaction between the component class and it’s corresponding template Step 1: for new project creation Step 2: For project running follow this command app.module.ts file app.component.ts file app.component.html file
Using Template Variables to Interact with Child Components in Angular
Step1: events-app.component.ts file Step2: events-list.component.ts file Step3: events-thumbnail.component.ts file app.module.ts file (Register events component, event list component and event thumbnail component in angular module ) index.html file
Communicating with Parent Components in Angular
Step1: events-app.component.ts file Step2: events-list.component.ts file Step3: events-thumbnail.component.ts file app.module.ts file (Register events component, event list component and event thumbnail component in angular module ) index.html file
Communicating with Child-Components in Angular
Step1: events-app.component.ts file Step2: events-list.component.ts file Step3: events-thumbnail.component.ts file app.module.ts file (Register events component, event list component and event thumbnail component in angular module ) index.html file
Handling form control Events two way binding in Angular
Step 1: user-settings-form.component.html file Step 2: user-settings-form.component.ts file