Элемент HTML не найден при загрузке страницы

Question

В моей сети AG естьonRowClicked($event)который вызывает в своем собственном машинописном файле метод для заполнения пользовательского элемента, скажем<Details-Page>. Этот настраиваемый элемент содержит HTML-тег `' с идентификатором. Я пытаюсь обновить значение src тега '', но проблема в том, что мой элемент не найден.

мой код выглядит следующим образом Grid.Component.html

      <common-grid style="width: 100%; height: 100%;" [pageTitle]="pageTitle"
           [totalRecords]="totalRecords"
           [gridOptions]="gridOptions"
           [defaultColDef]="defaultColDef"
           [columnDefs]="columnDefs"
           [rowData]="rowData"
           [paginationPageSize]="paginationPageSize"
           [pageSize]="pageSize"
           [getContextMenuItems]="getContextMenuItems"
           [sessionKey]="sessionKey"
           [callingRoute]="callingRoute"
           rowSelection="single"
           (rowClicked)="onRowClicked($event)">
 </common-grid>
 <Details-Page [Data]="data" (closeDetailsModelEvent)="closeModal($event)"></Details-Page>

Grid.Component.ts

      ...
 onRowClicked(event: any) {
     var requestURL = "http://localhost:44493/#/myDataDetails/"+data.uniqueId;
     const myTable = document.getElementById("myDetailsPage") as HTMLElement | null;
     if (myTable !== null) {
         alert("Request URL: " + requestURL);
         myTable.setAttribute('src', requestURL);
     }
}
...

Подробности-Page.html

      ...
<embed style="width:100%;" id="myDetailsPage" src="" />
...

Проблема, с которой я сталкиваюсь, заключается в том, чтоmyDetailsPageвсегда имеет значение NULL, потому что элемент еще не создан, так как он является частью дочерней страницы, которая загружается после завершения rowClick, но мне нужен объект события, поскольку я использую данные из выбранной строки.

Q: Как я могу передать данные дочернему объекту и обновить src дляembedэлемент?