Angular Component Communication

By Deborah Kurata
For real-world Angular applications, you need effective solutions for tracking and sharing state and sending notifications between components. This course teaches you numerous communication techniques and, more importantly, which to use when.
Play course overview
Course info
Rating
(260)
Level
Intermediate
Updated
Jan 30, 2018
Duration
3h 39m
Table of contents
Course Overview
Course Overview 1m
Introduction
Course Outline 1m Sample Application 2m Get the Most from This Course 3m Introduction 3m
Communicating with a Template
Binding and Structural Directives 6m Guidelines and Summary 3m Getters and Setters 5m Two-way Binding, the Long Way 4m Introduction 1m Notifying the Component of User Changes 1m
ViewChild and ViewChildren
Guidelines and Summary 4m Demo: ViewChild and Angular Forms 5m ViewChildren 4m ViewChild 2m ViewChild and Angular Forms 4m Introduction 2m Demo: ViewChild and Accessing the Native Html Element 6m ViewChild and ngIf 6m
Communicating with a Child Component
Introduction 3m Building Child Components 7m Parent to Child Communication 2m Guidelines and Summary 4m Template Reference Variable 2m ViewChild Decorator 5m Watching for Changes 5m Input Property 6m
Communicating with a Parent Component
Guidelines and Summary 1m Output Property 6m Introduction 1m Child to Parent 2m
Communicating Through a Service
Component to Itself 3m Managing State 3m Guidelines and Summary 4m Component to Component 1m Introduction 2m Service Scope and Lifetime 6m Property Bag Service 7m
Communicating Through a State Management Service
Introduction 2m Demo: Retrieving State 5m Displaying Concurrent Components 3m Change Detection 5m Guidelines and Summary 5m Keeping State in Sync 6m Sharing Entity State 5m Demo: Maintaining State 5m State Management Service 2m
Communicating Through Service Notifications
Guidelines and Summary 3m Subject vs. BehaviorSubject 3m Demo: Subject 7m Service Notifications 3m Angular Component Communication 3m Introduction 2m Demo: More on the Subject 3m Subject 3m Demo: Cleaning up a Subscription 1m
Communicating Using the Router
Route Parameters 5m Guidelines and Summary 3m Introduction 1m Routing Basics 4m
Final Words
Closing 1m Learning More 1m Introduction 0m Recap 4m
Description
Course info
Rating
(260)
Level
Intermediate
Updated
Jan 30, 2018
Duration
3h 39m
Description

At the core of any Angular application is a set of components that need to communicate effectively to track and share state and send notifications. In this course, Angular Component Communication, you will learn numerous techniques for communicating between the components and other parts of an application. First, you will learn how a component communicates with its template, including binding, getters and setters, input and output properties, and the ViewChild decorator. Next, you will examine how to build services as an intermediary for communication between components and how to broadcast notifications from services using a Subject or BehaviorSubject. Finally, you will learn which techniques to use and when. When you are finished with this course, you'll have a deeper understanding of the many different ways for component communication so you can apply the most effective techniques for your application.

Course FAQ
Course FAQ
What is an Angular component?

An Angular component is the basic building block in an Angular application. It is composed of a selector, template, style, and other various properties for processing the component.

What is the purpose of an Angular component?

Angular components use simpler, component-based application structure, making it easier to write an app in a similar way to using web components.

What will I learn in this course?

In this Angular Component Communication course you will learn about:

  • How a componenet communicates with its template
  • Binding and structural directives
  • Getters and Setters
  • Input and Output properties
  • ViewChild decorator
  • Communicating through a service
  • Communicating using the router
  • Much more
Who is this course for?

This course is for anyone who wants to learn about Angular components, and for those who need effective solutions for tracking and sharing state and sending notifications between components.

Are there prerequisites to this course?

You should be familiar with Angular and have some experience working with/building Angular applications.

About the author
Deborah Kurata
About the author

Deborah Kurata is a software developer, consultant, Pluralsight author, Google Developer Expert (GDE), and Microsoft Most Valuable Professional (MVP). Follow her on twitter: @deborahkurata

More from the author
Angular: Getting Started
Beginner
5h 52m
Apr 21, 2020
Defensive Coding in C#
Beginner
2h 14m
Jan 2, 2020
Angular Reactive Forms
Intermediate
3h 51m
Sep 5, 2019
More courses by Deborah Kurata
Section Introduction Transcripts
Section Introduction Transcripts

Course Overview
Hello. My name is Deborah Kurata. Welcome to my course, Angular Component Communication from Pluralsight. When building real world Angular applications, you need effective solutions for tracking and sharing state and sending notifications between components. This course presents numerous communication techniques and, more importantly, which technique to use when. You'll see ways for a component to communicate with its template, including binding, getters and setters, input and output properties, and the ViewChild and ViewChildren decorators. You'll examine how to build services as an intermediary for communication between components and how to broadcast notifications from services using Subject or BehaviorSubject. Router components provide additional communication techniques including required, optional, and query parameters. By the end of this course, you'll have a deeper understanding of the many different ways for component communication so you can apply the most effective techniques for your application. I hope you'll join me on this journey through Angular Component Communication from Pluralsight.

You're the smartest person in the room

PROVE IT

Your team won't just close the skills gap

THEY'LL HURDLE IT