Load a ui component with ajax within admin tab

Question

Using the below method to attempt to load a uicomponent over ajax into a tab within custom admin page shows a loading spinner which never completely loads.

XML for controller added buttons to the initial ui element

<referenceBlock name="ticketingo_ticket_form">
    <block class="Harrigo\Ticketingo\Block\Adminhtml\Ticket\Edit\Tab\Comments" name="ticketingo_ticket_form_comments" >
            <action method="setTabLabel">
            <argument name="label" xsi:type="string">Comments</argument>
        </action>
    </block>
</referenceBlock>

Block code for tab button

...
public function getTabUrl()
{
    return $this->getUrl('tickets/comment/viewcommentstab', ['_current' => true]);
}

public function isAjaxLoaded()
{
    return true;
}
...

Controller for uicomponent (Button points to this controller)

...
    public function execute()
    {
        $this->_view->loadLayout();
        $this->_view->renderLayout();
    }
...

Layout declares the ui component (This layout is then pulled over ajax)

<?xml version="1.0"?>
<layout xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <container name="content" label="Root">
        <uiComponent name="custommodule_ui_component"/>
    </container>
</layout>

This starts to load the uicomponent fine however spinner remains spinning indefinitely.

I've attempted running quick fixes like below:

https://github.com/magento/magento2/issues/9885

Not sure what the scope name is have used the same as within data-bind="scope: 'ticketingo_ticket_comments.ticketingo_ticket_comments'" on the ui component markup however this does not seem to work for me and issue remains.

require(['jquery', 'uiRegistry'], function ($, reg) {
    reg.remove('ticketingo_ticket_comments.ticketingo_ticket_comments'); 
    $('#container').trigger('contentUpdated'); 
    $('#container').applyBindings();
});

The ui componenets load fine if added into the main xml for the controller however I have not modified these for tabs and they remain the same, I've just moved into the tabs.

Within the core customer edit page <insertListing> seems to be being used where elements are loaded via ajax. Looks like i may need to use this method but not quite sure how it is used yet as cannot see much documentation on how to use this and cant quite work out what is required from the core. Similar question below however answer seems a little to vague on how to get insert listing to work.

Magento 2 form ui component ajax fieldset

Answer 1

I had a similar issue in admin customer orders tab. I had changed field from store select dropdown to ui-select dropdown but it wasn't rendering. The solution was to

$('#container').applyBindings();
$('#container').trigger('contentUpdated');

To apply :

1. bindings first i.e applyBindings()
2. trigger contentUpdated i.e trigger('contentUpdated')

Hope this helps :)