Salesforce lightning: Aprire il component come modale

Se cliccando su un bottone di una pagina lightning voglio aprire un modale posso provare questa soluzione

modale + bottone

<aura:component >
    <ui:button label="openmodal" press="{!c.openmodal}"  />
   <div role="dialog" tabindex="-1" aria-labelledby="header43" aura:id="Modalbox" class="slds-modal">
        <div class="slds-modal__container">
            <div class="slds-modal__header">
                <button class="slds-button slds-modal__close slds-button--icon-inverse" title="Close" onclick="{!c.closeModal}">
                    <c:svgIcon svgPath="/resource/slds/assets/icons/utility-sprite/svg/symbols.svg#close"  size="small"  />
                    <span class="slds-assistive-text">Close</span>
                </button>
                <h2 id="header43" class="slds-text-heading--medium">Test Modal</h2>
            </div>
            <div class="slds-modal__content slds-p-around--medium">
                <div>
                    <c:componentB />
                </div>
            </div>
            <div class="slds-modal__footer">
            </div>
        </div>
    </div>
    <div class="slds-backdrop " aura:id="Modalbackdrop"></div>
</aura:component>

controller

({
    closeModal:function(component,event,helper){    
        var cmpTarget = component.find('Modalbox');
        var cmpBack = component.find('Modalbackdrop');
        $A.util.removeClass(cmpBack,'slds-backdrop--open');
        $A.util.removeClass(cmpTarget, 'slds-fade-in-open'); 
    },
    openmodal: function(component,event,helper) {
        var cmpTarget = component.find('Modalbox');
        var cmpBack = component.find('Modalbackdrop');
        $A.util.addClass(cmpTarget, 'slds-fade-in-open');
        $A.util.addClass(cmpBack, 'slds-backdrop--open'); 
    }

})