Ion-split-pane work on angular?

I started out with Ionic using React (don’t even bother) and had an IonSplitPane working in that project. I escaped to Angular and started a new tabbed app and typed in my split pane elements just as I had them on React but I get a cryptic error:


I have tried using the syntax from the documentation and have scoured the internet looking for a solution to this error. No matter how I define content, contentId, or whatever and match up the ID with my menu and main content the split-pane just blows up. I’m happy to cobble together my own split-pane master/detail component but it would be nice if this worked or was at least removed from the docs. I’m on all the latest default framework versions…whatever comes with “ionic start.”

In the error message, it shows an ion-nav with the id content e.g. #content.

Do you have an element like that in your markup with that id?

That is an example provided by the error message. There is no ion-nav in my code.

Yeah I know, that’s what I’m saying. If there’s no element with the Id of content then it’s gonna fail surely.

This is one of mine that works:

  <ion-split-pane contentId="my-content">
    <ion-menu contentId="my-content">
    <ion-router-outlet id="my-content"></ion-router-outlet>