Как передать объект из одного компонента из другого компонента, используя angular6

Question

Я новичок в угловой. Я создаю форму, и после ее отправки я получу данные в объекте. Мне нужно передать этот объект другому компоненту, возможно ли это с помощью свойства @Input. Если да, как мы можем достичь этого, используя свойство @Input. Пожалуйста, помогите мне.

parent.component.html

    <form [formGroup]="addForm" (ngSubmit)="onSubmit()">
      Name: <input type="text" formControlName="name" placeholder="Name"><br/>
     Fname: <input type="text" formControlName="fname" placeholder="FirstNAme"><br/>
     Lname: <input type="text" formControlName="lname" placeholder="LastName"><br/>
    <button>Submit</button>
      </form>

<h1>Hello {{message}}</h1> <br/> 

  <app-forms [parentObject]="FormObject">]</app-forms>

parent.component.ts

import { Component, OnInit,Input } from '@angular/core';
import { FormGroup ,FormBuilder } from '@angular/forms';
import {Router} from "@angular/router";

@Component({
  selector: 'app-form1',
  templateUrl: './form1.component.html',
  styleUrls: ['./form1.component.css']
})
export class Form1Component implements OnInit {

  addForm:FormGroup;

  parentObject:Object;

  constructor(private fb:FormBuilder, private router: Router) { }

  ngOnInit() {
this.addForm=this.fb.group({
  name:[''],
  fname:[''],
  lname:['']

})
  }

  onSubmit(){
    console.log(this.addForm.value);
    var  FormObject=this.addForm.value
  }

}

child.component.ts

import { Component, OnInit,Input } from '@angular/core';

@Component({
  selector: 'app-forms',
  templateUrl: './forms.component.html',
  styleUrls: ['./forms.component.css']
})
export class FormsComponent implements OnInit {
  @Input() parentObject: Object;
 constructor() { }


  ngOnInit() {
    console.log(this.parentObject);
  }

}

Answer 1

в вашем дочернем компоненте определите вход как:

import { Input} from '@angular/core';

 @Input() some_variable_name: Object;

теперь в вашем родительском компоненте передайте ваш объект как:

<child-component [some_variable_name] = "object_variable" />

проверьте официальную документацию для получения более подробной информации: https://angular.io/guide/component-interaction