Question

我正在将MVC3与Knockout.js一起使用，并希望在模板中使用data-bind = addContribute将api中的一些数据附加到我的按钮。这个按钮应该打开一个弹出框，我需要弹出的附加按钮数据。我怎么能这样做？

我的模板：

<div>
        <ul data-bind="template: {name: 'membersTemplate', foreach: viewModel.membersList}">
        </ul>
</div>

<script id="membersTemplate" type="text/html">
    <li>
        <div class="fl width165">
            <img src=" ${ image } " width="33" height="34" />
            <span> ${ memberName } </span>
            ${ memberType }
        </div>
        <aside class="fr margint10">
            <label> ${ contributions } </label>
            <a href="#" class="sprite-add_img" id="openContribute" title="Add Contributes to Goals" data-bind="click: viewModel.addContribute" ></a>
        </aside>
    </li>
</script>

Answer 1

<script id="membersTemplate" type="text/html">
    <li>
        <div class="fl width165">
            <img data-bind="attr : {src : img}" width="33" height="34" />
            <span data-bind="text : memberName"></span>
            <span data-bind="text : memberType"></span>
        </div>
        <aside class="fr margint10">
            <label data-bind="text : contributions"></label>
            <a href="#" class="sprite-add_img" id="openContribute" title="Add Contributes to Goals" data-bind="click: addContribute" ></a>
        </aside>
    </li>
</script>

您的代码中的

membersList变量应该是下一个

function SingleMember(img, name, type, contr)
{
   var self = this
   self.img = ko.observable(img)
   self.memberName = ko.observable(name)
   self.memberType = ko.observable(type)
   self.contributions = ko.observable(contr)  
   self.addContribute = function() {  
       //  
    }
 }

window.viewModel = new function()  
{  
   var self = this  
   self.membersList = ko.observableArray()  
   self.membersList.push(new SingleMember(/*.... params1*/))  
   self.membersList.push(new SingleMember(/*.... params2*/))
}

使用Knockout.js中的按钮动态绑定数据？

1 个答案: