Categories
Angular Answers

How to pass data between two components in Angular?

Spread the love

Sometimes, we want to pass data between two components in Angular.

In this article, we’ll look at how to pass data between two components in Angular.

How to pass data between two components in Angular?

To pass data between two components in Angular, we can use Input.

For instance, we write

import { Component, Input } from "angular2/core";

@Component({
  selector: "child",
  styles: [``],
  template: ``,
})
export class ChildComponent {
  @Input() valueToPass = 0;
}

to add the valueToPass Input.

Then in the parent, we write

<child [valueToPass]="value"></child>

to add the child component in the template and get the valueToPass value and assign it to value in the parent.

Conclusion

To pass data between two components in Angular, we can use Input.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *