I need to get the values from an array that it's in the child component and display that data in the parent component, how can I do that?

I was showing the data from the array only when the ‘save’ button was clicked but now I need to display the array by default.

child.component.ts

    tabs = [
    {
      name: 'Tab 1',
      placeholder: 'placeholder1',
      formControlName: 'inputValue',
      value: '',
    },
    {
      name: 'Tab 2',
      placeholder: 'placeholder2',
      formControlName: 'inputValue',
      value: '',
    },
  ];

STACKBLITZ

CodePudding user response：

You just need to implement OnInit in your child component in your case.

export class ChildComponent implements OnInit

Then call your submit() method within your OnInit implementation

ngOnInit(): void {
  this.submit();
}

So when the child gets initialized, it emmits the array.

CodePudding user response：

you can use output method in child component ,

@Output() selectedtabs = new EventEmitter<tabs[]>();

ngOnInit(): {
submit(tab:tabs){
  this.selectedtabs.emit(tab);
}

here tabs is the interface , 
// on parent component 

//parent html 
 <component-name  (selectedtabs)="selecttabs($event)"></component-name>

//parent ts file

ngOnInit(): {
selecttab(tab: tabs) {
    this.selectedtab = tab;
  }