reinitialize the component with button click in ember

i have installed jquery builder in my ember app. I have to initialize the builder twice in the same template.

First i have to initialize when page is routed to the particular id. here is my hbs code>>>

 <div class="col-12 col-sm-12 col-md-12 col-lg-12 col-xl-12 px-0" >
                                                
                                                    
                                                        <div id="showBuilderBase"></div>
                                                        
                                                     
                                                    
                                            </div> 

where query-builder-comp is a component.

Second i want to show the query builder into a modal which will open with click of a button. here is my hbs code.>>

   <!-- Central Modal Medium Info -->
    <div class="modal fade" id="queryBuilderModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <div class="modal-dialog modal-notify modal-info modal-lg" role="document">
            <!--Content-->
            <div class="modal-content">
                <!--Header-->
                <div class="modal-header py-1 blue lighten-3">
                    <p class="heading lead">Story Filter</p>

                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true" class="white-text">&times;</span>
                    </button>
                </div>

                <!--Body-->
                <div class="modal-body">
                    <div class="row">

                                          </div> 
                                          <div class="card-content remove-space builderHt" id="buildRuleTop">
                                            <div class="mx-0 mb-1">
                                            
                                                 
                                                   <div id="showBuilderModal"></div>
                                                    
                                                   
                                             
                                                 <div class="row grey-text indicatorMessage p-3 brown lighten-5"><i class="fa fa-hand-o-up fa-lg purple-text" aria-hidden="true"></i>&nbsp;&nbsp;Please select the collection name to begin.</div>    
                                                    
                                            </div> 
                                          </div>
                                          </div> 

                    </div>
                </div>

                <!--Footer-->
                <div class="modal-footer justify-content-center py-0">
                    <a type="button" class="btn btn-warning btn-sm" >Save </a>
                    <a type="button" class="btn btn-outline-secondary-modal waves-effect btn-sm" data-dismiss="modal">Cancel</a>
                </div>
            </div>
            <!--/.Content-->
        </div>
    </div>
    <!-- Central Modal Medium Info-->

but the query builder is no showing up in the modal. how to deal with this issue.