I am Trying to add menu options by a button

Question

I am using Parent child data communication to add this functionality , It is giving exact result when I am using component selector, but when I try to access through Dialog box it is giving an error "Cannot read properties push of undefined". Note: dialogbox- child component App-component - Parent Componententer image description here

enter image description here

//parent component template :
<mat-card>
<mat-card-title>MenuItem</mat-card-title>
<mat-card-subtitle>Design your menu items</mat-card-subtitle>
  <mat-card-content>
  <div class="btns">
    <button mat-raised-button color="warn" [matMenuTriggerFor]="item"> Main Menu</button>
    <mat-menu #item="matMenu">
      <button mat-menu-item *ngFor="let item of items" routerLink="/{{item}}">{{item}}</button> 
    </mat-menu>
    <button mat-stroked-button color="warn" (click)="openDialog()" >Add More</button>
  </div>

  </mat-card-content>
</mat-card>
<router-outlet></router-outlet>
<app-additems-dialog (arr)="itemsEvent($event)" ></app-additems-dialog>

//Parent component class:
import { Component, OnInit, ViewChild } from '@angular/core';
import { MatDialog } from '@angular/material/dialog';
import { AdditemsDialogComponent } from './additems-dialog/additems-dialog.component';

@Component({
  selector: 'app-root',
  templateUrl:'./app.component.html',
  styleUrls: ['./app.component.css'],
})
export class AppComponent implements OnInit {
  title = 'add';
   items=[];
   urls:string[]= [];
   ref:boolean=false;

  constructor(private dialog:MatDialog){}
  ngOnInit(): void {
      
  }
  openDialog(){
    this.dialog.open(AdditemsDialogComponent);
   }
   itemsEvent($event:any){
     this.items = $event;
     console.log(this.items)
   }
  

}
//child component html:
<div mat-card   class="form" >
    <form mat-card-content  #Addmore="ngForm" (submit)="addmore(Addmore)">
        <label for="name">Section Name</label>
        <input type="text" [(ngModel)]="section" name="section" id="name" placeholder="Enter Section Name">
        <label for="url">Enter section Url</label>
        <input type="text" [(ngModel)]="address" name="address" id="url" placeholder="Enter section URl">
        <button mat-card-actions type="submit">Save</button>
    </form>
</div>
//child component class:
import { Component, Input, OnInit, Output,EventEmitter } from '@angular/core';
import { NgForm } from '@angular/forms';




@Component({
  selector: 'app-additems-dialog',
  templateUrl: './additems-dialog.component.html',
  styleUrls: ['./additems-dialog.component.css']
})
export class AdditemsDialogComponent implements OnInit {
  section:any="";
  address:any="";
  // @Input()childarray!:string[];
  items:string[]=[];
  url:string[]=[];
  @Output() arr:EventEmitter<any> = new EventEmitter;
  constructor() {
   }

  ngOnInit(): void { 
     this.arr.emit(this.items);
   }
  //  addmore(formValue:NgForm){
  //    console.log(this.childarray);
  //    this.childarray.push(formValue.value.section);
  //  }

  addmore(forms:NgForm){
    this.items.push(forms.value.section);
    this.url.push(forms.value.address);
    console.log(this.items,this.url,forms.value); 

  }

}