Injecting PHP generated HTML into Angular 7 App Component

Overview
I have created a single page Angular 7 app which serves as the backend of a website. I would like to upgrade to Angular 7 from AngularJS for the frontend website, but I have concerns about SEO. At the end of the day, I like the component structure of Angular 2+ and typescript as opposed to AngularJs. I would also like to avoid Angular Universal at this time due to time constraints.

Problem
As it is today, the front end website generates the HTML on the server side and the AngularJS app bootstraps using the ng-app attribute on the body element. This works great for SEO since all the html is already served/available. When trying to use Angular 2+, the html has to be part of the app component template and I have yet to figure out how I can bind the app component to the generated html from the server. I'm okay with child components using client-side templates, but I'd like to get the majority of the website generated on the server side and then have a library of cool components that I can simply inject into the html generated by the server.

What I'd like to be able to do:

<!-- All the following HTML is generated on the server side (PHP)-->
<body>
  <app-root>
   <!-- how to tell the app component to use this html instead of whatever is compiled in Angular? -->
    <div id="App Root Component">
      <div>Some html</div>
      <component-a tag="does some cool stuff"></component-a><!-- Angular now behaves as normal here -->
      <div>Some other html</div>
      <component-b tag="does other cool stuff"></component-b><!-- Angular now behaves as normal here -->
    </div>
  </app-root>
</body>

This doesn't work because the AppComponent will overwrite all content within with its own template.

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

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',/*The html in here will overwrite all contents within <app-root>, even if it's empty, or if this statement is omitted*/
  styleUrls: ['./app.component.scss']
})
export class AppComponent {
  title = 'app-www';
}

Perhaps I'm trying to fit a square peg into a round hole here, but it seems to me that it would be pretty cool to have most of the static html generated on the server side while having the flexibility to use the features of Angular 2+ for various interactive components.