将 jQuery 事件函数应用于新的 Knockout.js 数组元素
Applying jQuery event functions to new Knockout.js array elements
我有一个 Knockout.js 视图模型,其中包含一个 products
列表,其中包含一个 ASP.NET Web API 调用:
// Define viewmodel
var myViewModel = {
products = ko.observableArray([]);
};
// Apply knockout bindings
ko.applyBindings(vm);
// Function that obtains product data
function listProducts(viewmodel) {
var productsQuery = "api/products/get";
// Send an AJAX request
$.getJSON(productsQuery).done(viewmodel.products);
}
当我调用listProducts
时,每个元素都成功添加到ff。 HTML <ul>
:
<ul data-bind="foreach: products">
<li class="item">
<data-bind="text: productName">
</li>
</ul>
但是,当添加每个项目时,应用于我的 .item
元素的 jQuery 函数:
$(".item").click(function () {
$(this).toggleClass("selected");
});
不会应用于这些新添加的元素。
问题:如何向 Knockout.js observableArray 添加元素,这些元素也会继承相应的 jQuery 方法?
基本上你需要回到淘汰赛文档并阅读,阅读,阅读!忘记用 jquery 做这件事,这不是 ko 的方式。 Knockout 让你摆脱这种编码风格,你只需要 grok 它。
提示:
使用点击绑定和 css 绑定
http://knockoutjs.com/documentation/css-binding.html
顺便说一句,你也可以这样做:
$.getJSON(productsQuery).done(viewmodel.products);
我有一个 Knockout.js 视图模型,其中包含一个 products
列表,其中包含一个 ASP.NET Web API 调用:
// Define viewmodel
var myViewModel = {
products = ko.observableArray([]);
};
// Apply knockout bindings
ko.applyBindings(vm);
// Function that obtains product data
function listProducts(viewmodel) {
var productsQuery = "api/products/get";
// Send an AJAX request
$.getJSON(productsQuery).done(viewmodel.products);
}
当我调用listProducts
时,每个元素都成功添加到ff。 HTML <ul>
:
<ul data-bind="foreach: products">
<li class="item">
<data-bind="text: productName">
</li>
</ul>
但是,当添加每个项目时,应用于我的 .item
元素的 jQuery 函数:
$(".item").click(function () {
$(this).toggleClass("selected");
});
不会应用于这些新添加的元素。
问题:如何向 Knockout.js observableArray 添加元素,这些元素也会继承相应的 jQuery 方法?
基本上你需要回到淘汰赛文档并阅读,阅读,阅读!忘记用 jquery 做这件事,这不是 ko 的方式。 Knockout 让你摆脱这种编码风格,你只需要 grok 它。
提示:
使用点击绑定和 css 绑定
http://knockoutjs.com/documentation/css-binding.html
顺便说一句,你也可以这样做:
$.getJSON(productsQuery).done(viewmodel.products);