在 PhoneJS 上的选项卡小部件内加载 dxWidget答案

【问题标题】：Load dxWidget inside tab widget on PhoneJS在 PhoneJS 上的选项卡小部件内加载 dxWidget
【发布时间】：2013-11-02 16:30:36
【问题描述】：

如何在选项卡小部件的内容中加载图库小部件？

我试过把：

<div data-bind="dxGallery: { dataSource: galleryData }"></div>

标签小部件的content参数内部：

tabs = [
  { text: L["ABOUT_ME"], icon: "user", content: '<div data-bind="dxGallery: { dataSource: galleryData }"></div>' }

但是小部件不是以这种方式显示的。我该怎么办？

【问题讨论】：

标签： jquery phonejs

【解决方案1】：

请听从here的建议。

在您的场景中使用if 绑定。您的代码应如下所示：

<div id="tabs" data-bind="dxTabs: { items: tabs, selectedIndex: selectedTab }"></div>
<div id="tabContent" style="height:300px;" >
        <!-- ko if: !selectedTab() -->
           <div>Tab1</div>
        <!-- /ko -->
        <!-- ko if: selectedTab() == 1 -->
           <div data-bind="dxGallery: { dataSource: galleryData  }"></div>
        <!-- /ko -->
        <!-- ko if: selectedTab() == 2 -->
           <div>Tab3</div>
        <!-- /ko -->

var viewModel = {
    galleryData: [
      "images/person1.png",
      "images/person2.png",
      "images/person3.png"
    ],
    tabs: [
        { text: "user", icon: "user" },
        { text: "comment", icon: "comment" },
        { text: "find", icon: "find" },
    ],
    selectedTab: ko.observable(0)

};

【讨论】：

【解决方案2】：

我认为，您应该使用选项“html”而不是“内容”（in accordance with the documentation）。

【讨论】：

html 指的是项目元素（菜单按钮），而不是选项卡的内容。