-1

我正在尝试使用 jQuery.UI 选项卡创建一个带有动态选项卡的页面。在我看来，我有这段代码：

<div id="tabs" class="tabs">
<ul data-bind='foreach: sites'>
    <li><a data-bind="attr: { href: site().tabIdLink}"><span data-bind="text: site().Name"></span></a></li>
</ul>
<!-- ko foreach: sites -->
<div data-bind="attr: { 'id': site().tabId }">
    <h3 data-bind="text: site().Name"></h3>
</div>
<!-- /ko -->

这个视图模型：

function ViewModel(api) {
    var self = this;

    self.sites = ko.observableArray([]);    
    self.addSite = function (data) {
        self.sites.push(new Site(data));
    };        

    $.getJSON(api + "allsites", "", function (allSites) {
        var mappedData = $.map(allSites, function (item)
        {
            return new Site(item);
        });
        self.sites(mappedData);
        $("#tabs").tabs();
    });
}

function Site(data) {
    var self = this;
    self.id = data.Id;
    self.tabId = "tab_" + data.Id;
    self.tabIdLink = "#" + self.tabId;
    self.site = ko.observable(data);
}

一切正常，除了我无法设置 div 标签上的 id 属性。有什么建议么 ？

4

2 回答 2

2

site().tabId不起作用，因为site它是一个可观察的对象，它包含没有该tabId属性的原始数据对象，请考虑改为这样做$data.tabId或只是tabId

于 2013-11-08T07:30:27.707 回答
1

这将起作用：

 <div data-bind="attr: { 'id': tabId }">
于 2013-11-08T07:30:49.427 回答