个人中心
文章发布
退出
作者热门文章
- android - RelativeLayout 背景可绘制重叠内容
- android - 如何链接 cpufeatures lib 以获取 native android 库？
- java - OnItemClickListener 不起作用，但 OnLongItemClickListener 在自定义 ListView 中起作用
- java - Android 文件转字符串
27
4
我在我的 Cordova 应用程序中使用以下代码进行虚拟 DOM 元素数据绑定(bind)。此代码适用于 IE 11、Android 和 iOS，但不适用于 Windows 8.1 Cordova App
如果我使用常规 DOM 元素绑定(bind)，它也适用于 Windows。但我的要求是使用虚拟 DOM 元素绑定(bind)。
我们将不胜感激任何形式的帮助。
<html>
<head>
<meta charset="utf-8" />
<title>Prooduct</title>
<link href="css/index.css" rel="stylesheet" />
<script src="libs/knockout/knockout.js"></script>
<script type="text/html" id="product-template">
<ul>
<!-- ko foreach: productArray-->
<li><span data-bind="text: productName"></span><br /></li>
<!-- /ko -->
</ul>
</script>
</head>
<body>
<h4>Product List</h4>
<div data-bind="template: { name: 'product-template'}"></div>
<script type="text/javascript">
function ProductViewModel() {
this.productArray = ko.observableArray([
{ productName: 'Milk' },
{ productName: 'Oil' },
{ productName: 'Butter' }]);
}
ko.applyBindings(new ProductViewModel());
</script>
</body>
</html>
最佳答案
我使用 cordova CLI 4.3.1/Visual Studio 2015/Windows 10 和 Windows 8.1(远程调试)测试成功:
index.js:
// and then run "window.location.reload()" in the JavaScript Console.
$(document).ready(function () {
document.addEventListener( 'deviceready', onDeviceReady.bind( this ), false );
function onDeviceReady() {
// Handle the Cordova pause and resume events
document.addEventListener( 'pause', onPause.bind( this ), false );
document.addEventListener( 'resume', onResume.bind( this ), false );
// TODO: Cordova has been loaded. Perform any initialization that requires Cordova here.
};
function onPause() {
// TODO: This application has been suspended. Save application state here.
};
function onResume() {
// TODO: This application has been reactivated. Restore application state here.
};
function AppViewModel() {
var self = this;
self.productArray = ko.observableArray([
{ productName: 'Milk' },
{ productName: 'Oil' },
{ productName: 'Butter' }]);
self.removeProduct = function () {
self.productArray.remove(this);
}
};
var vm = new AppViewModel();
ko.applyBindings(vm);
});
index.html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>testios</title>
<!-- testios references -->
<link href="css/index.css" rel="stylesheet" />
</head>
<body>
<h2>List of product</h2>
<hr />
<ul>
<!-- ko foreach: productArray -->
<li>
<span data-bind="text: productName"></span> <a href="#" data-bind="click: $parent.removeProduct">Remove </a>
</li>
<!-- /ko -->
</ul>
<!-- Cordova reference, this is added to your app when it's built. -->
<script src="scripts/jquery-2.1.4.js"></script>
<script src="scripts/knockout-3.3.0.js"></script>
<script src="cordova.js"></script>
<script src="scripts/platformOverrides.js"></script>
<script src="scripts/index.js"></script>
</body>
</html>
初始窗口:
点击 Remove Oil 后:
你用的是最新的knockout-3.3.0.js吗？
在我看来，您也可以在没有 cordova 的情况下使用 IE 对其进行测试，因为它是相同的浏览器引擎:
在 Windows 10 下的 IE11 和 MS Edge 20.10240.16384.0 中测试
找到根本原因的一个好方法是查看 DOM-Explorer，看看发生了什么。它会在您开始调试时自动打开，或者您可以在调试期间在 Visual Studio 右上角的“快速启动”字段中键入“DOM”来打开它:
...并在 JavaScript 中设置断点，以验证是否抛出点击事件:
关于windows - 模板内虚拟元素上的 Knockout JS 数据绑定(bind)在 Windows 8.1 Cordova 应用程序上不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31674567/
27
4
0
我想认真学习更多关于 ES6 的知识。我一直在网上做一些例子，虽然我得到了大部分例子，但有时我什至不知道从哪里开始。请注意，我对这个 ES6 和 Knockout 的东西 super 菜鸟，想通过从他
我正在使用 knockout.mapping 将我的 javascript 对象转换为可观察到的 knockout 。在这个 javascript 对象内部是一个嵌套对象，并且这个嵌套对象正在被转换，
我正在用 Kendo、Knockout 和 kendo-knockoutjs 库做一些实验。我想将 knockout View 模型与剑道数据源一起使用，并将其绑定(bind)到剑道网格小部件。 在剑
有谁知道现在当 jQuery.tmpl is not being actively developed or maintained anymore 时 Knockout 的默认模板引擎会发生什么？ K
我面临一个问题，即添加新项目时计算的可观察数组未更新。 self.FilteredCityList = ko.computed(function() { var filteredCollectio
我想对数组中的多个属性使用 this fiddle 中的 ko.utils.arrayGetDistinctValues，因此我将数组映射到我想要的两个属性的数组 viewModel.justCate
我在使用 Knockout 的映射插件时遇到了一个奇怪的问题。 如果我通过映射填充一个 observable 数组，我将无法迭代该数组或获取其长度，即使 UI 已正确更新，该数组似乎也是空的。 你可以
所以我试图让 knockout 与 summernote 打得很好。它并没有真正起作用。我意识到这是因为 Summernote 使用了 而不仅仅是一个输入字段。 我的绑定(bind)是这样的: ko.
另一个我似乎无法找到帮助的 knockout 问题。 我基本上是在尝试实现级联下拉列表。前几天我请求帮助了解如何解析我的复杂 JSON(它来自 cakePHP Controller 。前几天我收到的帮
我在尝试使用映射插件将项目更新为 observableArray 的一部分时遇到问题。 我有以下代码 accounts.list = ko.mapping.fromJS(@(Html.Raw(Mode
有几件事我不明白。 根据 KO 文档(以及关于 SO 的许多帖子)，在查询和编写 observable 时应该使用括号。但是在绑定(bind)子属性时，在我看来，是否使用括号并不重要。 = 都返回
我从 WCF 接收数据并将其绑定(bind)到表。我在这个论坛上得到了帮助，添加了一些计算字段，一切都很完美。我想在此表的页脚添加总计。我的页面的简单版本可以在 http://jsfiddle.net
我有一个使用 Knockout 显示过滤列表的页面。 View 模型有一个对象数组，以及一个使用 ko.utils.arrayFilter 来过滤数组的 ko.computed。 有时过滤会变得非常复
我正在使用 jquery quicksearch 来搜索由 knockout foreach 循环填充的表。 需要启动快速搜索元素 foreach 结束后 . 我尝试了几种方法，但到目前为止都没有成功
我正在尝试使用类似于 silverlight 中的数据表单的数据网格来创建数据表单功能。 我有一个 div 来显示从网格中选择的项目: $('#readDate').attr('data-bind',
我有一个带有分页功能的 View 模型，它维护 pageIndex 属性。 Viewmodel 有一个包含页面的页面数组。每个页面都有自己的 pageNumber 属性。 我的 View 模型的分页代
名称+复选框的单向绑定(bind)工作正常，但它最初不适用于单选按钮employeeTypeA，尽管它在viewmodel中的值为true，html显示单选按钮未设置，为什么会这样？
我正在尝试解决ko映射的一个小问题。场景是我的ViewModel基本上是对象的集合。每个对象都是通过json调用创建的，方法是: var ViewModel = ko.observableArray(
使用 computed 的主要区别是什么？函数和 subscribe在knockout.js 中的功能？ 最佳答案 计算出的 observable 通常用于返回计算出的值。作为计算评估的一部分访问的任
我有带有项目验证的ko.observableArrays。用户可以将项目标记为已删除。将其标记为已删除时，我需要在该项目上禁用验证。 您如何动态禁用验证？ 示例:http://jsfiddle.net
我是一名优秀的程序员,十分优秀！