李項目點擊事件的動態綁定

我有杜蘭和敲除web應用程序。我有一個HTML如下：李項目點擊事件的動態綁定

<ul id="header"> 

</ul>

在.js文件功能我動態添加Li爲：

$("#header).append('<li id="btn"><a href="javascript://" data-bind="click:function(data,event) { $root.testmethod(data,event); return true;}"> <span class="name">Test</span></a></li>') 

ko.applyBindingsToNode(ul);

我知道的事實，我綁定applyBindings後的李一直被稱爲。要動態添加它，我正在使用 ko.applyBindingsToNode（ul）; ，但仍然沒有運氣。

任何人都可以請告訴我最新的語法/替代解決方案嗎？

來源

2016-04-26 user1400915

在KO文檔頁面有一個簡單的例子http://knockoutjs.com/documentation/foreach-binding.html而不是所有這些黑客，你可以使用簡單的foreach綁定並將新的li項目推送到數組 – kasperoo

我想回答我自己的問題。

解決方案非常簡單。

在的.js文件定義可觀察到的陣列

self.arraysample = ko.observableArray([]);

在方法填充數據

self.arraysample.push(data)

在HTML頁面中的數組，我們可以這樣做：

<ul id="head" data-bind:"foeach:arraysample"> 

    <li> 
     <a id="btn"> 
     <span data-bind="text:$data.arrayelement"></span> 
     </a> 
    </li> 
</ul>

多數民衆贊成它是否在「self.arraysample」的變化，自動更新將發生，因爲淘汰賽js屬性。

我希望它可以幫助別人，因爲我在網絡上看到過很多例子，建議再次使用ko.applyBindings（），它根本不起作用。

來源

2016-05-11 05:00:12 user1400915

//開始JavaScript評論。這意味着，<a href="javascript:後一切都被註釋掉了，產生的代碼將是這個樣子：

$("#header).append('<li id="btn"><a href="javascript: 
ko.applyBindingsToNode(ul);

此外，ko.applyBindingsToNode通話將是'字符串的一部分剛上append呼叫開括號後打開。

要解決這個問題，需要通過他們之前放置反斜槓逃脫這些意見：

href="javascript:\/\/"

來源

2016-04-26 09:03:43

參考演示here。

請找到下面的代碼：

HTML：

<ul id="header"> 

</ul>

JS：

$(function() { 
    $("#header").append('<li id="btn">' + '<a href="javascript://" data-bind="click:function(data,event) { $root.testmethod(data,event); return true;}"> <span class="name">Test</span></a></li>'); 
    //ko.applyBindingsToNode(ul); 
});

來源

2016-04-26 09:10:47 Shashank

使用的foreach：

var DemoPage = (function() { 
 
    function DemoPage() { 
 
    var _this = this; 
 
    _this.buttons = ko.observableArray([]); 
 
    _this.debug = ko.observable(''); 
 
    _this.testmethod = function(data, event) { 
 
     _this.debug('Clicked LI: ' + data.buttonId); 
 
    } 
 
    _this.addHeadingRow = function() { 
 
     _this.buttons.push({ 
 
     buttonId: Math.floor(Math.random() * 100) 
 
     }); 
 
    } 
 
    } 
 
    return DemoPage; 
 
})(); 
 

 

 
var demoApp = new DemoPage(); 
 
ko.applyBindings(demoApp);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 

 
<ul id="header" data-bind="foreach: buttons"> 
 
    <li id="btn"> 
 
    <a data-bind="click: $root.testmethod"> 
 
     <span class="name">Test</span> 
 
    </a> 
 
    </li> 
 
</ul> 
 

 
<button data-bind="click: addHeadingRow">add heading row</button> 
 
<p data-bind="text: debug"></p>

來源

2016-04-26 09:46:30 kasperoo

李項目點擊事件的動態綁定

回答

相關問題