Dynamically creating a form in Angularjs and Ionic

Question

I have recently started converting a pure jquery mobile app into angularjs and ionic. However there is one thing I am struggling to figure out, and that is how to create a truly dynamic form. I have seen examples using ng-repeat where you can dynamically add one type of input. However the forms I am building come from a server so I need to dynamically add any number and combination of different types of inputs (dates, dropdowns, textareas etc) based on the information I retrieve from the server. Does anyone know where I could find an example of how to do this? Here is a sample of my jquery mobile code to give you an idea of what I am trying to achieve:

if (field.Display_Type == "Combo" || field.Display_Type== "LocationIndexLookup" || field.Display_Type == "Country" || field.Display_Type== "UserLookup"||field.Display_Type=="CustomDataLookup")
    { addCombo(div, field); }

    else if(field.Display_Type=="Checkbox")
    { addCheckbox(div, field);}

    else if (field.Display_Type == "MultiValue")//Check multicombo
    { addMultiCombo(div, field); }

    else if (field.Display_Type == "Text")
    { addText(div, field); }

    else if (field.Display_Type == "Date")
    { addDate(div, field); }

    else if (field.Display_Type=="DateTime")
    {addDateTime(div,field); }

    else if (field.Display_Type == "Notes")
    { addNote(div, field); }

    else if(field.Display_Type=="Numeric")
    { addNumeric(div, field); }

    else if (field.Display_Type =="Time")
    { addTime(div, field); }

    else if (field.Display_Type== "ContactsLookup"||field.Display_Type=="RecordDataLookup")
    {
        addContact(div, field);
    }

    else if (field.Display_Type=="Rating")
    { addRating(div, field) }

    else if(field.Display_Type=="Signature")
    { addSignature(div, field); }

    else if(field.Display_Type=="Hidden") 
    {
        //alert("hidden");
    }

    else if(field.Display_Type=="ProjectsLookup")
    {
        addProjectsLookup(div, field);
    }

    else if (field.Display_Type=="DocumentsLookup")
    {
        addDocumentsLookup(div, field);
    }

    else 
    { addText(div, field); }

    if(field.HelpNotes!=null && field.HelpNotes!="")
    { addHelpNote(div, field);}

}

each of these calls a function to add the appropriate dom element such as:

function addCombo(div, data) {
$("#" + div).append("<b style=\"align:left !important; text-align:left !important;\">" + data.Caption + ": <br> <Select id=\"Field" + data.OwnID + "\" class=\"" + data.Required + "\"></Select>").trigger("create");
$("#Field" + data.OwnID).append($('<option>', {
    value: "",
    text: ""
})).trigger("create");
for (i in data.Options) {
    //display the data in the key-value pair
    $("#Field" + data.OwnID).append($('<option>', {
        value: data.Options[i].Value,
        text: data.Options[i].Caption
    })).trigger("create");
}
$("#Field" + data.OwnID).selectmenu("refresh");

}

some of the fields that are added have custom behaviours that I have coded, so I do not want to use an existing form builder library for angular.

Thanks in advance