javascript - 使用 Knockout 绑定(bind) jQuery Mobile 小部件的属性

Question

我的 jQuery Mobile 应用程序中有一个页面有两个基于链接的按钮，我想将它们的属性绑定(bind)到 ko.observable() 对象:

<div data-role="page" id="details">
    <div data-role="content">
        <!-- ko with: selectedPerson -->
        <div>
            <h2 data-bind="text: name"></h2>                                        
            <a data-role="button" data-bind="attr: { href: phoneLink, title: phone}, text : phone"></a>         
            <a data-role="button" data-bind="attr: { href: emailLink, title: email}, text : email"></a>
        </div>
        <!-- /ko -->                
    </div>
</div>

问题是链接没有呈现为按钮，我认为它们是简单的链接。

如何让 jqm 和 knockout 协同工作？我需要为它编写自定义绑定(bind)吗？

谢谢

Answer 1

发生这种情况是因为当您对 anchor 标签进行按钮化时，这些新标签不存在。要在它们创建后扣上它们，您将不得不告诉 knockout 在它们被添加到集合中后做一些事情。值得庆幸的是，knockout 为您提供了一个在屏幕上呈现元素后立即执行的函数。

可以在此处看到使用 afterAdd 的示例:

http://knockoutjs.com/examples/animatedTransitions.html

不幸的是，我只见过它适用于模板而不适用于内联 html，因此您可能需要稍微重构您的 html。