Dynamically adding components to application not working

Question

I am trying to create and add components dynamically to application. The new component is created successfully but not rendering in UI.

Please find the source code below. I am passing component name via URL param to the application

Application

<aura:application >
    <aura:attribute name="componentName" type="String" default=""/>

    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
</aura:application>

App Controller

doInit : function(component, event, helper) {
        var compName = "c:" + component.get("v.componentName");
        $A.createComponent(
            compName,
            {},
            function(newComp, status){
                if (component.isValid()) {
                    var body = component.get("v.body");
                    body.push(newComp);
                    component.set("v.body", body);
                }
            });
    }

Answer 1

You need to include {!v.body} in the component mark up, where you you want to display your dynamic component. for example :

<aura:application >
    <aura:attribute name="componentName" type="String" default=""/>
    The dynamic component oes here :
    {!v.body}
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
</aura:application>