Subcomponents are not render
<p>I'm traying to render subcomponents inside my custom step but don't work.</p>

<p>I want show the list cart as the first step.</p>

<p>Here's my code:</p>

<p>checkout_index_index.xml</p>

<pre><code>&lt;page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" layout="1column" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"&gt;
    &lt;body&gt;
        &lt;referenceBlock name="checkout.root"&gt;
                &lt;arguments&gt;
                    &lt;argument name="jsLayout" xsi:type="array"&gt;
                        &lt;item name="components" xsi:type="array"&gt;
                            &lt;item name="checkout" xsi:type="array"&gt;
                                &lt;item name="children" xsi:type="array"&gt;
                                    &lt;item name="steps" xsi:type="array"&gt;
                                        &lt;item name="children" xsi:type="array"&gt;
                                            &lt;!-- The new step you add --&gt;
                                            &lt;item name="summary-step" xsi:type="array"&gt;
                                                &lt;item name="component" xsi:type="string"&gt;CloudMobile_CheckoutExt/js/view/summary-step&lt;/item&gt;
                                                    &lt;!--To display step content before shipping step "sortOrder" value should be &lt; 1--&gt;
                                                    &lt;!--To display step content between shipping step and payment step  1 &lt; "sortOrder" &lt; 2 --&gt;
                                                    &lt;!--To display step content after payment step "sortOrder" &gt; 2 --&gt;
                                                &lt;item name="sortOrder" xsi:type="string"&gt;0&lt;/item&gt;
                                                &lt;item name="displayArea" xsi:type="string"&gt;summary-step&lt;/item&gt;
                                                &lt;item name="children" xsi:type="array"&gt;
                                                    &lt;item name="totals" xsi:type="array"&gt;
                                                        &lt;item name="component" xsi:type="string"&gt;Magento_Checkout/js/view/summary/totals&lt;/item&gt;
                                                        &lt;item name="displayArea" xsi:type="string"&gt;totals&lt;/item&gt;
                                                        &lt;item name="config" xsi:type="array"&gt;
                                                            &lt;item name="template" xsi:type="string"&gt;Magento_Checkout/summary/totals&lt;/item&gt;
                                                        &lt;/item&gt;
                                                        &lt;item name="children" xsi:type="array"&gt;
                                                            &lt;!-- sort order for this totals is configured on admin panel--&gt;
                                                            &lt;!-- Stores-&gt;Configuration-&gt;SALES-&gt;Sales-&gt;General-&gt;Checkout Totals Sort Order --&gt;
                                                            &lt;item name="subtotal" xsi:type="array"&gt;
                                                                &lt;item name="component"  xsi:type="string"&gt;Magento_Checkout/js/view/summary/subtotal&lt;/item&gt;
                                                                &lt;item name="config" xsi:type="array"&gt;
                                                                    &lt;item name="title" xsi:type="string" translate="true"&gt;Cart Subtotal&lt;/item&gt;
                                                                &lt;/item&gt;
                                                            &lt;/item&gt;
                                                            &lt;item name="shipping" xsi:type="array"&gt;
                                                                &lt;item name="component"  xsi:type="string"&gt;Magento_Checkout/js/view/summary/shipping&lt;/item&gt;
                                                                &lt;item name="config" xsi:type="array"&gt;
                                                                    &lt;item name="title" xsi:type="string" translate="true"&gt;Shipping&lt;/item&gt;
                                                                    &lt;item name="notCalculatedMessage" xsi:type="string" translate="true"&gt;Not yet calculated&lt;/item&gt;
                                                                &lt;/item&gt;
                                                            &lt;/item&gt;
                                                            &lt;item name="grand-total" xsi:type="array"&gt;
                                                                &lt;item name="component"  xsi:type="string"&gt;Magento_Checkout/js/view/summary/grand-total&lt;/item&gt;
                                                                &lt;item name="config" xsi:type="array"&gt;
                                                                    &lt;item name="title" xsi:type="string" translate="true"&gt;Order Total&lt;/item&gt;
                                                                &lt;/item&gt;
                                                            &lt;/item&gt;
                                                        &lt;/item&gt;
                                                    &lt;/item&gt;
                                                    &lt;item name="itemsBefore" xsi:type="array"&gt;
                                                        &lt;item name="component" xsi:type="string"&gt;uiComponent&lt;/item&gt;
                                                        &lt;item name="children" xsi:type="array"&gt;
                                                            &lt;!-- merge your components here --&gt;
                                                        &lt;/item&gt;
                                                    &lt;/item&gt;
                                                    &lt;item name="cart_items" xsi:type="array"&gt;
                                                        &lt;item name="component" xsi:type="string"&gt;Magento_Checkout/js/view/summary/cart-items&lt;/item&gt;
                                                        &lt;item name="children" xsi:type="array"&gt;
                                                            &lt;item name="details" xsi:type="array"&gt;
                                                                &lt;item name="component" xsi:type="string"&gt;Magento_Checkout/js/view/summary/item/details&lt;/item&gt;
                                                                &lt;item name="children" xsi:type="array"&gt;
                                                                    &lt;item name="thumbnail" xsi:type="array"&gt;
                                                                        &lt;item name="component" xsi:type="string"&gt;Magento_Checkout/js/view/summary/item/details/thumbnail&lt;/item&gt;
                                                                        &lt;item name="displayArea" xsi:type="string"&gt;before_details&lt;/item&gt;
                                                                    &lt;/item&gt;
                                                                    &lt;item name="subtotal" xsi:type="array"&gt;
                                                                        &lt;item name="component" xsi:type="string"&gt;Magento_Checkout/js/view/summary/item/details/subtotal&lt;/item&gt;
                                                                        &lt;item name="displayArea" xsi:type="string"&gt;after_details&lt;/item&gt;
                                                                    &lt;/item&gt;
                                                                &lt;/item&gt;
                                                            &lt;/item&gt;

                                                        &lt;/item&gt;
                                                    &lt;/item&gt;
                                                    &lt;item name="itemsAfter" xsi:type="array"&gt;
                                                        &lt;item name="component" xsi:type="string"&gt;uiComponent&lt;/item&gt;
                                                        &lt;item name="children" xsi:type="array"&gt;
                                                            &lt;!-- merge your components here --&gt;
                                                        &lt;/item&gt;
                                                    &lt;/item&gt;
                                                &lt;/item&gt;
                                            &lt;/item&gt;
                                        &lt;/item&gt;
                                    &lt;/item&gt;
                                &lt;/item&gt;
                            &lt;/item&gt;
                        &lt;/item&gt;
                    &lt;/argument&gt;
                &lt;/arguments&gt;
        &lt;/referenceBlock&gt;
    &lt;/body&gt;
&lt;/page&gt;
</code></pre>

<p>web/js/view/summary-step.js</p>

<pre><code>define(
    [
        'ko',
        'uiComponent',
        'underscore',
        'Magento_Checkout/js/model/step-navigator'
    ],
    function (
        ko,
        Component,
        _,
        stepNavigator
    ) {
        'use strict';
        /**
        *
        * mystep - is the name of the component's .html template, 
        * &lt;Vendor&gt;_&lt;Module&gt;  - is the name of the your module directory.
        * 
        */
        return Component.extend({
            defaults: {
                template: 'CloudMobile_CheckoutExt/summary-step'
            },

            //add here your logic to display step,
            isVisible: ko.observable(true),

            /**
            *
            * @returns {*}
            */
            initialize: function () {
                this._super();
                // register your step
                stepNavigator.registerStep(
                    //step code will be used as step content id in the component template
                    'summary-step',
                    //step alias
                    null,
                    //step title value
                    'Summary',
                    //observable property with logic when display step or hide step
                    this.isVisible,

                    _.bind(this.navigate, this),

                    /**
                    * sort order value
                    * 'sort order value' &lt; 10: step displays before shipping step;
                    * 10 &lt; 'sort order value' &lt; 20 : step displays between shipping and payment step
                    * 'sort order value' &gt; 20 : step displays after payment step
                    */
                    1
                );
                return this;
            },

            /**
            * The navigate() method is responsible for navigation between checkout step
            * during checkout. You can add custom logic, for example some conditions
            * for switching to your custom step 
            */
            navigate: function () {

            },

            /**
            * @returns void
            */
            navigateToNextStep: function () {
                stepNavigator.next();
            }
        });
    }
);
</code></pre>

<p>web/template/summary-step.html</p>

<pre><code>&lt;!--The 'step_code' value from the .js file should be used--&gt;
&lt;li id="summary-step" data-bind="fadeVisible: isVisible"&gt;
    &lt;div class="step-title" data-bind="i18n: 'Summary'" data-role="title"&gt;&lt;/div&gt;
    &lt;div id="checkout-step-title"
         class="step-content"
         data-role="content"&gt;
        &lt;!-- ko foreach: getRegion('summary-step') --&gt;
            &lt;!-- ko template: getTemplate() --&gt;&lt;!-- /ko --&gt;
        &lt;!--/ko--&gt;
        &lt;form data-bind="submit: navigateToNextStep" novalidate="novalidate"&gt;
            &lt;div class="actions-toolbar"&gt;
                &lt;div class="primary"&gt;
                    &lt;button data-role="opc-continue" type="submit" class="button action continue primary"&gt;
                        &lt;span&gt;&lt;!-- ko i18n: 'Next'--&gt;&lt;!-- /ko --&gt;&lt;/span&gt;
                    &lt;/button&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/form&gt;
    &lt;/div&gt;
&lt;/li&gt;
</code></pre>