Javascript 从visual force页面向lightning组件添加html

我想知道是否有可能将HTML模板添加到我在VisualForce页面中调用的lightning组件中。我的Vf页面中有此模板：

<script id="user_filter_template" type="text/x-kendo-template">
            <input type="text" id="comboBox" name="comboBox"/>
            <div class="container" id="checkboxWrapper" style="margin-top: 10px;">
                <p style="display: inline; margin-top: 10px;">Enable: </p>
                <input type="checkbox" id="ownerFilterCheckbox" style="margin-top: 2px;"/>    
            </div>
        </script>

第一个$Lightning.createComponent创建了作为我的组件的选项卡栏，但我尝试将aura:html元素的主体设置为我的模板，然后将我的选项卡内容的主体设置为新组件，但我得到“此页面有错误。您可能只需要刷新它。rerender在”markup://aura:html' [w.o.u不是函数]失败描述符：{markup://aura:html“错误

我的组件当前看起来如下所示：

<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">
        {!v.body}
    </div>

{！v.body}

我正在使用剑道UI，所以根本不知道如何在lightning组件中使用它…这就是为什么我想从我的VisualForce页面将这些模板设置到lighting组件中的原因，因为这样剑道元素就会全部设置好，准备好了，然后砰的一声放进组件中

---

提前感谢您的帮助！

您应该使用此功能将HTML模板设置为Lightning组件，但目前此功能仅在Developer Edition orgs中提供，因为它是开发人员预览。您可以添加第三方框架，如AngularJS、React等。

您应该使用此功能将HTML模板设置为Lightning组件nt，但目前此功能仅在开发者版orgs中可用，因为它是开发者预览。您可以添加第三方框架，如AngularJS、React等。

您可以将脚本登录到lightning component controller中

或

---

您可以使用$A.createComponent（）动态创建。您可以将脚本登录写入lightning component controller

或

---

您使用$A.createComponent（）动态创建。

您能解释多一点吗？在lightning component中编写html代码，然后使用$a.createComponent调用lightning component。您也可以在组件中使用运行时变量值。您能解释多一点吗？在lightning component中编写html代码，然后使用$a.createComponent调用lightning component。您也可以在组件中使用运行时变量值。

<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">
        {!v.body}
    </div>