function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Tyler DahleTyler Dahle 

Embed html template into lightning component?

I have my component like this:
 
<aura:component >
    <aura:attribute name="opts" type="List" default="['Tyler Dahle','Molly Demouser','Penny Demouser', 'Ted Demouser']"/>
	
    <div class="slds-tabs--scoped">
    	<ul aura:id="tabBar" class="slds-tabs--scoped__nav" role="tablist">
        	<li aura:id="ownerTab_item" class="slds-tabs--scoped__item" title="ownerTab" role="presentation" onclick="{!c.ownerTabSelect}"><a class="slds-tabs--scoped__link" href="javascript:void(0);" role="tab" tabindex="-1" aria-selected="true" aria-controls="ownerTabContent" id="ownerTab"><lightning:icon iconName="utility:groups"/></a></li>
        	<li aura:id="locationTab_item" class="slds-tabs--scoped__item" title="locationTab" role="presentation" onclick="{!c.locationTabSelect}"><a class="slds-tabs--scoped__link" href="javascript:void(0);" role="tab" tabindex="-1" aria-selected="true" aria-controls="locationTabContent" id="locationTab"><lightning:icon iconName="utility:location"/></a></li>
            <li aura:id="descriptionTab_item" class="slds-tabs--scoped__item" title="descriptionTab" role="presentation" onclick="{!c.descriptionTabSelect}"><a class="slds-tabs--scoped__link" href="javascript:void(0);" role="tab" tabindex="-1" aria-selected="true" aria-controls="descriptionTabContent" id="descriptionTab"><lightning:icon iconName="utility:description"/></a></li>
            <li aura:id="typeTab_item" class="slds-tabs--scoped__item" title="typeTab" role="presentation" onclick="{!c.typeTabSelect}"><a class="slds-tabs--scoped__link" href="javascript:void(0);" role="tab" tabindex="-1" aria-selected="true" aria-controls="typeTabContent" id="typeTab"><lightning:icon iconName="utility:picklist"/></a></li>
            <li aura:id="customTab_item" class="slds-tabs--scoped__item" title="customTab" role="presentation" onclick="{!c.customTabSelect}"><a class="slds-tabs--scoped__link" href="javascript:void(0);" role="tab" tabindex="-1" aria-selected="true" aria-controls="customTabContent" id="customTab"><lightning:icon iconName="utility:apps"/></a></li>
            <li aura:id="settingsTab_item" class="slds-tabs--scoped__item" title="settingsTab" role="presentation" onclick="{!c.settingsTabSelect}"><a class="slds-tabs--scoped__link" href="javascript:void(0);" role="tab" tabindex="-1" aria-selected="true" aria-controls="settingsTabContent" id="settingsTab"><lightning:icon iconName="utility:settings"/></a></li>
        </ul>
        <div aura:id="ownerTabContent" class="slds-tabs--scoped__content slds-hide" role="tabpanel" aria-labelledby="ownerTab">
        	<lightning:select name="users" label="Select Users/Groups/Resources:">
            	<aura:iteration items="{!v.opts}" var="option">
                	<option>{!option}</option>
                </aura:iteration>
            </lightning:select>
            <lightning:input type="checkbox" label="Enable" name="Enable User Filter" checked="true"/>
        </div>
        <div aura:id="locationTabContent" class="slds-tabs--scoped__content slds-hide" role="tabpanel" aria-labelledby="locationTab">
        	<lightning:select name="users" label="Select Locations:">
            	<aura:iteration items="{!v.opts}" var="option">
                	<option>{!option}</option>
                </aura:iteration>
            </lightning:select>
            <lightning:input type="checkbox" label="Enable" name="Enable User Filter" checked="true"/>
        </div>
        <div aura:id="descriptionTabContent" class="slds-tabs--scoped__content slds-hide" role="tabpanel" aria-labelledby="descriptionTab">
        	<lightning:select name="users" label="Enter Description:">
            	<aura:iteration items="{!v.opts}" var="option">
                	<option>{!option}</option>
                </aura:iteration>
            </lightning:select>
            <lightning:input type="checkbox" label="Enable" name="Enable User Filter" checked="true"/>
        </div>
        <div aura:id="typeTabContent" class="slds-tabs--scoped__content slds-hide" role="tabpanel" aria-labelledby="typeTab">
        	<lightning:select name="users" label="Select Event Type:">
            	<aura:iteration items="{!v.opts}" var="option">
                	<option>{!option}</option>
                </aura:iteration>
            </lightning:select>
            <lightning:input type="checkbox" label="Enable" name="Enable User Filter" checked="true"/>
        </div>
        <div aura:id="customTabContent" class="slds-tabs--scoped__content slds-hide" role="tabpanel" aria-labelledby="settingsTab">
        	<lightning:select name="users" label="Custom Filters:">
            	<aura:iteration items="{!v.opts}" var="option">
                	<option>{!option}</option>
                </aura:iteration>
            </lightning:select>
            <lightning:input type="checkbox" label="Enable" name="Enable User Filter" checked="true"/>
        </div>
        <div aura:id="settingsTabContent" class="slds-tabs--scoped__content slds-hide" role="tabpanel" aria-labelledby="settingsTab">
        	<lightning:select name="users" label="User Settings:">
            	<aura:iteration items="{!v.opts}" var="option">
                	<option>{!option}</option>
                </aura:iteration>
            </lightning:select>
            <lightning:input type="checkbox" label="Enable" name="Enable User Filter" checked="true"/>
        </div>
    </div>
</aura:component>

However, I have a visualForce page that is displaying this component. In my visualforce page, I have html templates. I am wondering if it is possible to simply take those templates and throw them into the tab content instead of the <lightning:select> dropdown and <lightning:input> checkbox. 

I am having trouble finding information taking components in a visualforce page (like my html templates) and using them in the lightning component. The visualforce page is populating the components in the templates with all their data with its controller, so it would be super convenient if I could just throw the templates into my lightning component.

Thank you for any help!