I added one component named template in the blocks but when i try to drag another components inside this template component ,it will be dragged but after saving it removes all the components inside it. How to avoid this?

This is code of template component:

export default {
  init(editor) {
    editor.DomComponents.addType('myTemplate', {
      isComponent: el => el.tagName == 'template',
      model: {
        id: 'template',
        defaults: {
          tagName: 'template',
          hoverable: true,
          resizable: {
            minDim: 20,
            tc: 1, // Top handler
            cl: 1, // Left handler
            cr: 1, // Right handler
            bc: 1 // Bottom handler
          },
          // As by default, traits are binded to attributes, so to define
          // their initial value we can use attributes
          attributes: {
            'data-gjs-type': 'myTemplate'
          }
        }
      },
      view: {
        // eg. You can customize the tag in the canvas
        // By default, the view will use the same tag of the model
        tagName: 'div',
        // onRender() {
        //   this.el.innerHTML = `<div data-gjs-type="divWrapper" style="min-height:60px;"></div>`;
        // }
      }
    });
    editor.BlockManager.add('myTemplate', {
      label: `<div class="mdi mdi-table"></div>
          <label class="gjs-block-label">Template</label>`,
      category: 'Components',
      attributes: { class: 'gjs-block-section' },
      // Select the component once it's dropped
      select: true,
      // This triggers `active` event on dropped components and the `image`
      // reacts by opening the AssetManager
      activate: true,
      content:
        '<template style="width:100%" data-gjs-type="myTemplate"></template>'
    }); }};

I debugged it, so i got that : setComponents method in the dom_components clearing it ...but not getting why it is removing?

setComponents(components) {
      this.clear().addComponent(components);
}

setComponents calls clear method which is responsible for removing elements inside it

clear() {
      this.getComponents()
        .map(i => i)
        .forEach(i => i.remove());
      return this;
    }

I commented this so it was working fine and persisted the components inside component ...is there any way to avoid this?