我在使用映射插件时应该在何时何地声明我的viewModel时感到困惑.
这是我的json文件:
{
"members": [
{
"memberid": "001",
"membername": "Jason"
},
{
"memberid": "002",
"membername": "Bob"
}
]
}
这是html模板:
<div data-bind="foreach: members">
<h3 data-bind="text: memberid"></h3>
<p>Name: <span data-bind="text: membername"></span></p>
</div>
其余部分如下:
var data = $.getJSON("members.json",function(data)
{
var viewModel = ko.mapping.fromJSON(data);
ko.applyBindings(viewModel);
}
);
ko.mapping.fromJSON(data, viewModel);
提前感谢你的帮助!
我有一个看起来像这样的模型(不是实际的代码所以不介意可能的错误输入).
model = function(option, items) {
self = this;
self.options = options;
self.items = ko.mapping.fromJS(items);
}
该options的coantains列表对象,人们可以从一个下拉列表中选择.在items还包含对象的列表,其中每个对象具有一个像中的选项列表一个相同的对象.
然后,我遍历项目列表并在每行上显示一个下拉框.我这里需要将项目列表中当前项目中的对象作为选定选项.然而,当我没有设置optionValue但只尝试匹配整个对象时它不起作用...然后我的observable工作正常,并且整个对象的所有订阅字段都使用新选择进行更新.然而,我得到了初始选择以使用optionValue,Id如下所示.
<select data-bind="options: $parent.options, optionsValue:'Id', optionsText: 'Name', value: item.Id"></select>
我现在的问题是只有绑定到Id的元素才会更新？我需要更新当前项目的所有属性,即使它只是当我在下拉列表中更改内容时现在更改的ID.
我该怎么做？
我正在使用Knockout构建一个应用程序,并发现它非常有用.虽然,我有一个问题,获得多维数组(对象)可观察.
目前我正在使用以下结构:
self.form = ko.observableArray(ko.utils.arrayMap(initialData, function(section) {
var result = {
name : section.name,
code : section.code,
type : section.type,
fields: ko.observableArray(section.fields)
};
return result;
}));
它运行良好,但如果initialData超过两个级别,我无法使其工作.我试过类似的东西
self.form = ko.observableArray(ko.utils.arrayMap(initialData, function(block) {
var result = {
name : block.name,
code : block.code,
type : block.type,
sections: ko.observableArray(ko.utils.arrayMap(block.sections, function(section) {
var result = {
name : section.name,
code : section.code,
type : section.type,
fields: ko.observableArray(section.fields)
};
return result;
}))
};
return result;
}));
最终的数组结构看起来不错,但是当我在推送到sections数组时,淘汰不会更新DOM:
self.addField = function( section ) …我使用knockout.js和ko.mapping插件将json对象列表绑定到html网格.让每个项目称为卡片(以下简化示例)
{
"card": [
{
"Id": "cards/1",
"category": "Demo",
"title": "Card 1",
"description": "bla bla",
"picture": "demo1.jpg ",
"madeBy": "user/1"
},
{
"Id": "cards/2",
"category": "Demo",
"title": "Card 2",
"description": "bla bla",
"picture": "demo2.jpg",
"madeBy": "user/2"
}
]
}
我像这样绑定每个elemet:
<div data-bind="foreach: card">
<span data-bind="text:title"></span>
<a data-bind='click: show'><img data-bind="attr:{src: picture}" /></a>
</div>
当用户点击卡片时,我想在选定的json对象中使用更多属性显示所选卡片在不同的div(foreach之外)中
我应该从视图模型绑定到一张选定的卡？
我正在尝试类似的东西(但没有得到任何数据):
<h1 data-bind="text: $data.title"> </h1>
我的视图模型中有一堆金额是可观察的,我希望它们存储为数字,因为它们用于多次计算.但是,当我将它们绑定到我视图中的文本框时,我希望它们显示为特殊格式的字符串(1234.5678 =>"1,234.57").在这种情况下实现双向绑定的最佳方法是什么,因为我不能只使用与我的observable的值绑定？
用户需要能够在文本框中输入"1,234.56"或"1234.56",这将在observable中存储数字值1234.56,如果我通过javascript更改数值(3450),则需要将文本框值更新为新值,但格式化为字符串("3,450").
我很感激帮助!
javascript knockout-mapping-plugin knockout-2.0 knockout.js knockout-validation
我有javascript代码块和html如下.模型对象是通用的.它在运行时定义.
它可以是这样的.
var model = { "xId": ko.observable(0), "xName": ko.observable(null), "Type": ko.observable("x") };
/* var model = { "yId": ko.observable(0), "yName": ko.observable(null), "Type": ko.observable("y") };
var model = { "zId": ko.observable(0), "zName": ko.observable(null), "Type": ko.observable("z") }; */
var vm = function (data) {
ko.mapping.fromJS(data, {}, this);
};
var vm2 = function () {
var self = this;
self.New = ko.observable(null);
self.NewItem = function () {
console.log(model);
self.New(new vm(model));
};
};
var viewModel = new vm2();
ko.applyBindings(viewModel);
vm.prototype.Save = function () …我已经尝试了几天让Knockout每次在人员列表中的"邮政编码"值发生变化时举起一个事件.我尝试了各种方法来实现这种行为,但似乎无法做到这一点.目前,这是我的Html: -
<table>
<thead>
<tr>
<th>First name</th>
<th>Last Name</th>
<th>Age</th>
<th>Zip Code</th>
</tr>
</thead>
<tbody data-bind="foreach: people">
<tr>
<td data-bind="text: firstName"></td>
<td data-bind="text: lastName"></td>
<td data-bind="text: age"></td>
<td ><input id="zipCodInput" data-bind="value: zipCode" /></td>
</tr>
</tbody>
</table>
</body>
这是我填充表格的脚本: -
<script>
jQuery(document).ready(function () {
// Ultimately will come from an Ajax call
//var result = $.ajax({
// type: "GET",
// url: "/api/Resource",
// async: false
//}).responseText;
// Hard coded array for testing
var result = [{ "firstName": "Jimmy", "lastName": "Smith", "age": …我想使用插件来填充数据,但不会填充值.
简单的例子:
var data = {
Type: 1,
Id: "123-12321"
};
var RiskItemModel = function (item) {
var self = this;
self.Id = ko.observable("tes");
self.Type = ko.observable(); //enum int
if (item) {
// DATA SHOULD BE POPULATED HERE, but no effect
ko.mapping.fromJS(item, this);
};
};
var model = new RiskItemModel(data);
ko.applyBindings(model);
// I HAVE TRIED THIS ALSO, NO EFFECT
//ko.mapping.fromJS(data, model);
HTML:
<div>
<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>
</div>
JSFidde:http://jsfiddle.net/wLbV6/
我想得到一个从json到淘汰赛js的数组.为此,我使用此代码,我试图在adobe cq中实现.但我无法得到答复所以任何机构可以帮助我的代码
在jsp中
<table id="timesheets" class="table table-striped table-hover table-condensed">
<thead>
<tr>
<th>First Name</th>
<th>Last Name</th>
<th>Month</th>
<th>Year</th>
</tr>
</thead>
<tbody data-bind="foreach: viewModel.timesheets">
<tr>
<td data-bind="text: firstname"></td>
<td data-bind="text: lastname"></td>
<td data-bind="text: month"></td>
<td data-bind="text: year"></td>
</tr>
</tbody>
</table>
在脚本中
<script>
$(function () {
ko.applyBindings(viewModel);
viewModel.loadTimesheets();
});
function timesheet(timesheet) {
this.id = ko.observable(timesheet.id);
this.firstname = ko.observable(timesheet.firstname);
this.lastname = ko.observable(timesheet.lastname);
this.month = ko.observable(timesheet.month);
this.year = ko.observable(timesheet.year);
}
var viewModel = {
timesheets: ko.observableArray([]),
loadTimesheets: function () {
var self = this;
$.getJSON("/content/personal/test0/jcr:content/content-page/horizontalline.json",function …我正在尝试使用淘汰映射,但它没有像我预期的那样工作.在这里,我创造了最简单的小提琴,但它不起作用.
我错过了什么吗？
https://jsfiddle.net/p48d11j5/1/
function Model(){
var self = this;
self.Id = ko.observable(0);
self.Name = ko.observable("Default");
self.Visible = ko.observable(false);
self.Items = ko.observableArray([]);
}
function ModelItem(){
var self = this;
self.Id = ko.observable(0);
self.Name = ko.observable("Default item name")
}
var m = new Model();
ko.mapping.fromJS({
Id:1,
Name: "Test",
Visible: true,
Items: [
{
Id:1,
Name:"First"
},
{
Id:2,
Name:"Second"
}
]
}, m);
ko.applyBindings(m);
编辑:我正在使用嵌套数组,所以我添加了数组
edit2:我希望模型"键入"以使用它们的函数或ko.computed属性