router-component | A simple , declarative router for Web Components | Router library

This did end up being a routes issue. Both my /programs and my / routes were displaying my CommentsContainer because I needed to add a ternary to essentially filter those routes out.

I added this code in my Programs (plural) component right after my Card component. It uses props.match to check if the route being rendered was NOT /programs and NOT /. When that statement evaluated to true, the CommentsContainer and associated comments were rendered on the /programs/:id. If either of those statements evaluated to true, it didn't render anything.

In my projects, I use to create specific routes to handle that. For instance, I have RouteAuthenticated, RouteUnauthenticated, RouteAdmin...

Normally you would bootstrap the AppComponent, whos template is anything + in some place, in the AppModule. Afterwards you would initialize the AppModule as entry point.

Without a main component as entry point I cant imagine how could you tell angular what should be the entry point of the application.

I would say its not possible. When you declare a component in bootstrap in the AppModule, angular will look for its css selector in index.html. If not found -> error. In the other hand, if you dont declare anything inside of the bootstrap section in your app module -> error. Furthermore, if you try to bootstrap the RouterOutet directive in your app module

Uncaught Error: RouterOutlet cannot be used as an entry component.

Also the following quote from the NgModule FAQ seems to support this:

You can embed the child components in the top component's template. Alternatively, make the top component a routing host by giving it a . Define child routes and let the router load module components into that outlet.

A React component in Typescript is defined like this:

class ComponentName extends React.Component { ... }

In this case BookingSiteOverview accepts props of type RouteComponentProps<{}> and uses a state of type IBookingSiteOverviewState.

RouteComponentProps<{}> does not include a definition for getProfiles, so that is causing the errors.

EDIT

getProfiles is defined in IBookingSiteOverviewProps (per the OP) so changing the props for BookingSiteOverview to RouteComponentProps<{}> & IBookingSiteOverviewProps resolves the issue:

Typing this out actually helped me work through the problem. Nothing like a good rubber duck. It looks like I misunderstood the nature of the router object. Apparently it needs to be a legitimate object, where I was under the impression it was accepting a collection. Thus, you need to define everything within the scope of a single parent. See below for how I solved it for my particular example: