Как вызвать метод дочернего компонента из родительского, если дочерний компонент еще не вызывается?

Question

У меня есть родительский компонент и дочерний компонент для добавления и обновления плитки с использованием компонента popum, теперь кнопка добавления находится в родительском компоненте, а обновление - в дочернем компоненте. когда нет плиток (разметка дочернего компонента), чтобы показать, я должен добавить плитку в то время, когда я не могу вызвать метод дочернего компонента openAddOrUpdatePopup ().

Как я могу вызвать этот метод в родительском компонент, не зависящий от дочернего компонента?

Мой код: - parent- html

<input type="button" class="btn" value="Add" (click)="applicationTile.openAddOrUpdatePopup()" />
<application-tile class="grid-item action-grid-item enable-events" *ngFor="let application of paginationParams.data" [ngClass]="{'active':activeApplication && activeApplication.applicationId == application.applicationId}" [application]="application"></application-tile>

parent.ts

export class ApplicationsComponent implements OnInit {
 @ViewChild (ApplicationTileComponent, {static: false}) applicationTile: ApplicationTileComponent ; 
}

Детский. html

<label class="name">{{application.applicationName}}</label>
<div class="table-view">

<div class="table-view-row">
    <div>
        <label>Application value </label>
        <span>{{application.value ? application.value  : '-'}}</span>
    </div>
        <label>Application Version</label>
        <span>{{application.appVersion ? application.appVersion : '-'}}</span>
    </div>
    <ul class="actions">
        <li>
            <span class="icon svg-icon action-icon edit-icon" title="Edit" 
 (click)="openAddOrUpdatePopup(application, $event)"></span>
        </li>

    </ul>
</div>

<av-popup class="medium-popup" *ngIf="popupParams && popupParams.name == 'create-or-update-application'" [popupParams]="popupParams" (close)="popupParams = null">
<form name="form" (ngSubmit)="f.form.valid && popupParams.saveOrUpdateApplication()" #f="ngForm"></form></av-popup>

child.ts

 openAddOrUpdatePopup(application?, $event?) {
       if (application) {
        application = JSON.parse(JSON.stringify(application));
       }
       else {
        application = {
        applicationType: this.applicationTypes[0].applicationTypeVal
       }
     }

this.popupParams = {
  name: 'create-or-update-application',
  title: application.applicationId ? 'Edit ' + application.applicationName : "Create New Application",
  application: application
}

} ​​

Answer 1

Можете ли вы уточнить вопрос немного больше? ИЛИ вы можете опубликовать рабочий код в Stackblitz и предоставить ссылку?

Существует несколько способов соединения с родительским и дочерним компонентами с помощью

Input & Output.

Общий сервис с Observer (Publi sh и подписка)