how to execute action methods of a component from a controller or router in ember

I need assistance in executing action methods defined in ember components from outside. (even though ember follows DATA Down and Actions Up approach). My usecase is as follows

Application Template

    <script type="text/x-handlebars-template" data-template-name="application">
       <h2> Dialog Component </h2>
       
    </script>

Index Template
    <script type="text/x-handlebars-template" data-template-name="index">
        <button >Open Dialog 1</button>
        <button >Open Dialog 2</button>
        
            Content of the Dialog ...
        

         Content of the dialog ... 
    </script>

Modal Dialog Template
    <script type="text/x-handlebars-template" data-template-name="components/modal-dialog">
        <div class="titlebar-title">
           <span>  </span>
           <a class="closeBtn" >X</a>
        </div>
        <div class="content">
         
        </div>
    </script>

Index Controller

App.IndexController = Ember.Controller.extend({
      openFirst : false,
      actions : {
         showDialog1 : function(){
            this.toggleProperty("openFirst");  // open and close the first dialog when clicking the button.
         },
         showDialog2 : function(){
            // want to trigger "open" action of modal-dialog component without using any conditionals(if-else) and without observing "auto-open" attribute
            ......

         },
         handleDialogOpen : function(dialogName){
            if(dialogName === "dlg1"){
               // do something.
            }else if(dialogName === "dlg2"){
               // do something
            }
         }
      }
});

Modal Dialog Component

App.ModalDialogComponent = Ember.Component.extend({
        tagName : 'div',
        classNames : ['ui-dialog'],
        attributeNames : ['title','name','auto-open'],
        didInsertElement : function(){
             if(this.get("auto-open")){
                this.send("open");
             }
        },
        actions : {
              open : function(){
                 $(this.element).show();
                 this.onOpen()
              },
              close : function(){
                  $(this.element).hide();
              }
        }
});

Css Style Definition

ui-dialog{
  display : none;
}

Is there any way to achieve this ? Kindly guide me.