Knockout -不从可观察的数组中检索数据
Knockout是一个JavaScript库，用于实现MVVM（Model-View-ViewModel）模式。它提供了一种简洁的方式来处理前端数据绑定、自动更新UI以及处理用户交互。
Knockout的主要特点包括：
- 数据绑定：Knockout通过使用可观察对象（observable）和可计算对象（computed）来实现数据绑定。可观察对象可以自动跟踪其值的变化，并通知相关的UI元素进行更新。
- UI自动更新：当可观察对象的值发生变化时，Knockout会自动更新相关的UI元素，保持UI与数据的同步。
- 依赖跟踪：Knockout可以自动跟踪可观察对象之间的依赖关系，当依赖的可观察对象发生变化时，相关的UI元素会自动更新。
- 声明式绑定：Knockout使用简洁的声明式语法来实现数据绑定，使得开发者可以更容易地理解和维护代码。
Knockout适用于各种前端开发场景，特别是需要频繁更新UI的复杂应用程序。以下是一些Knockout的应用场景：
- 表单处理：Knockout可以简化表单数据的绑定和验证，使得开发者可以更轻松地处理表单相关的逻辑。
- 动态列表：Knockout可以帮助开发者实现动态列表，当列表数据发生变化时，相关的UI元素会自动更新。
- 单页应用程序：Knockout可以与其他前端框架（如Angular、React等）结合使用，实现复杂的单页应用程序。
腾讯云提供了一些与Knockout相关的产品和服务，例如：
- 云服务器（CVM）：腾讯云的云服务器可以用于部署和运行Knockout应用程序。详情请参考：云服务器产品介绍
- 云数据库MySQL版（CDB）：腾讯云的云数据库MySQL版可以用于存储Knockout应用程序的数据。详情请参考：云数据库MySQL版产品介绍
- 云存储（COS）：腾讯云的云存储可以用于存储Knockout应用程序中的静态资源。详情请参考：云存储产品介绍
请注意，以上只是一些示例，腾讯云还提供了更多与Knockout相关的产品和服务，具体可根据实际需求进行选择和使用。
相关·内容
我需要在页面加载完成后从数据库中获取一个值，并运行一个函数，该函数将根据检索到的值填充多个下拉列表。类似于表单控件的更改事件。
如何使用Knockout.js完成此操作？
谢谢。
浏览 4提问于2012-09-04得票数 0
回答已采纳
我读过很多关于堆叠溢出和谷歌搜索的资料，但似乎没有什么与我的问题特别相关。
tl；博士我想将我的C#模型从我的视图传递到一个外部JS文件(Knockout)，这样我就可以使用来自模型的数据在我的视图上显示。
更多信息：
我有一个非常标准的ASP.NET MVC 5项目，包括(例如)、1个视图、1个控制器&一个C#视图模型，该模型被检索并在我的C#控制器中操作数据。我的外部JavaScript文件包含Knockout代码，特别是我希望将该C#模型放入外部JS文件中的observableArray中，这样我就可以将Knockout代码排除在我的视线之外(除了几行代码)。
示例：
books
浏览 2提问于2015-02-02得票数 4
回答已采纳
我正在使用knockout和jquery和asplnet mvc。我使用控制器中返回的json对象中的knockout来应用绑定。这是一个应用于我的标记。
如果用户单击屏幕上的按钮，我将调用控制器操作并再次从服务器检索数据。
此时，我是否需要将新的json对象重新绑定到knockout，或者如何处理它？
浏览 2提问于2013-02-21得票数 1
我试图通过ajax调用获取一个json对象，并将其放入一个可观察到的淘汰赛中。
var self = this;
this.arnVal = ko.observableArray([]);
var promise = $.getJSON('../../url/to/my/api');
promise.done(function(data) {
console.log(data);
console.log(data["metricValues"]);
self.arnVal(
浏览 5提问于2017-03-23得票数 0
回答已采纳
我使用knockout.js选项绑定下拉列表，如下所示：
<select data-bind="options: availableCountries,
optionsText: 'countryName',
value: selectedCountry,
optionsCaption: 'Choose...'"></select>
如果用于数据绑定的可观察数组为空，即没有下拉列表的选项，我希望select元素
浏览 12提问于2022-12-01得票数 0
1回答
使用ES6中的新符号类型，您可以对对象设置不可迭代的属性。但是，在使用Knockout时，默认情况下不会观察到这些符号。
可以绑定符号的值，但它从未更新过，因为它没有添加到可观察的对象中。
有没有人能够解决这个问题，强迫Knockout观察符号？
浏览 6提问于2015-10-29得票数 1
我试图通过结合使用MooTools和Knockout.js提供的OOP模式来保持代码的整洁
我似乎不能让它工作，因为Knockout返回了一些函数(属性函数，是吧？)当它的数据绑定这些值时。但是，如果这些值是用javascript检索的，那么它就会像exprected一样工作。我做了一个快速的jsFiddle，这样你就可以测试它了：
提前感谢！
浏览 0提问于2011-12-30得票数 1
回答已采纳
2回答
我调用一个检索和解析JSON的API，此时我实例化了LIST3，并试图将这个对象数组传递到ko.observable函数中。我遵循了这些教程，似乎在这里遇到了困难。
如果像教程所建议的那样，使用构造函数手动传递值，我就可以显示数据，所以逻辑看起来不错。我是想做KO不能做的事吗？
代码
var LIST3 = [];
var coreUrl = "https://cors.io/?http://rundistance.azurewebsites.net/api/";
var listUrl = coreUrl + "RunnerService";
$(docum
浏览 2提问于2018-10-18得票数 1
回答已采纳
我习惯于在ASP.NET请求时用一些数据加载部分视图和用户控件。在看到Knockout组件后，我试图弄清楚如何对文档做类似的事情，但无法弄清楚。
有没有人能帮我举个简单的例子，告诉我如何做一些简单的事情，比如获取一个满是数据的表，并根据所单击的行加载一个Knockout组件？
<tbody data-bind="foreach: unapprovedNotes">
<tr>
<td><a href="#" data-bind="click: fetchNote(id())">
浏览 2提问于2014-10-08得票数 1
我想呈现一个表，其中包含我的服务器发送给我的对象列表。我现在正在做这个：
<table>
<thead>
<tr>
<th>id</th>
<th>Name</th>
<th>Status</th>
</tr>
</thead>
<tbody data-bind="foreach: services">
<tr>
<td data-
浏览 3提问于2015-07-11得票数 1
回答已采纳
2回答
我有一个ko.computed()函数，它代理这样的集合：
function ListView(query) {
var self = this;
this.query = query;
this.items = ko.observableArray([]);
ko.computed( function() {
self.items( self.query() == null ? [] : self.query().postings() );
}
// more code
}
不幸的是，这会导致self.items()变量随着
浏览 10提问于2012-04-22得票数 4
回答已采纳
如何使用knockout js映射插件迭代绑定到数据的knockout可观察数组？我已经创建了 fiddle来演示我的问题。当我尝试获取knockout js数组对象的值时，它返回一个函数。
有人能帮我解决这件事吗？我的代码如下所示。
//Sample JSON Array
var data =
[{"street":"2532 Falkark Dr", "lat":"39.926295", "lng":"-86.012919", "zipcode":"92256"
浏览 0提问于2013-05-21得票数 6
回答已采纳
1回答
我很难理解什么时候应该使用()来调用knockout.js中的变量。
让我们举个例子：
function RandomViewModel() {
var self = this;
self.randomJ = new randomSquare;
}
var randomSquare = ko.observable({
innate: ko.observableArray([ { star: "randomStar", type: "starList" } ])
});
如果我想将div的文本设置为randomJ中的元素，代码如下：
&l
浏览 0提问于2013-02-12得票数 2
回答已采纳
我正在尝试将一个可观察的数组持久化到localStorage。为了做到这一点，我使用了ko.toJSON。
var that = this;
this.items = ko.observableArray();
this.items.subscribe(function(){
localStorage.setItem("items", ko.toJSON(that.items()));
});
所有被持久化到localStorage的是false。
它抛出一个非常随机的错误：knockout-3.4.2.js:55 Uncaught DOMException: Fail
浏览 1提问于2018-03-10得票数 2
回答已采纳
我对knockout还是个新手，我不能让if数据绑定工作……
html：
<div data-bind="if: items.length">
<h1>List</h1>
<ul data-bind="foreach: items">
<li data-bind="text: $data">
</li>
</ul>
</div>
javascript
浏览 0提问于2012-10-09得票数 3
回答已采纳
2回答
我有一个Javascript ajax函数，可以从服务器检索注释(注意:我对Knockout JS还不熟悉)：
function Comments() {
var self = this;
self.commentArray = ko.observableArray();
self.getNewerComments = function(lastCommentId) {
pageId = $('body').attr('id');
$.ajax({
type: "GET",
dataType: &#
浏览 3提问于2014-10-23得票数 1
回答已采纳
1回答
伙计们，我的英语不太好。但我会尽我所能
我刚开始使用knockout，这个工具给我留下了深刻的印象。我在MVC3应用程序的新页面上使用了这个框架。但是我刚刚遇到了一个问题，那就是如何用数据库中的数据标记我的清单。
<div data-bind="foreach: listPeople">
<div>
<label>
<input type="checkbox" data-bind="attr: { value: id_person}, checked: $paren
浏览 0提问于2012-05-15得票数 2
回答已采纳
使用Knockout JS集可见:对可观察数组中的项进行数据绑定。有没有一种方法可以在Knockout JS中得到一个条目数量的计数，特别是使用可见数据绑定= true？
我试过这样的方法(不起作用)：
var visibleItems = ko.utils.arrayFilter(self.MyItems(), function(item) {
return item.visible == true;
});
var result = visibleItems().length;
在这个测试中，item.visible是未定义的。这就是我正在寻找的，我
浏览 4提问于2014-08-08得票数 0
回答已采纳
1回答
我试图让knockout地图插件与Ryan Niemeyer的可排序插件一起工作，但没有成功。在我的示例中，如果您尝试将一个项目排序到列表的中间，那么它总是将它放在底部。排序到列表顶部是可行的，但如果您尝试将项目排序到除顶部之外的任何其他位置，它将自动转到列表底部。
示例：
下面是我的html：
<div id="results">
<h3>Tasks</h3>
<ul data-bind="sortable: series">
<
浏览 0提问于2012-11-29得票数 0
回答已采纳
大家好，我是knockout.js的新手，对绑定数据从服务器到淘汰机的最佳方式感兴趣。例如，我想要绑定类别变量，然后在select中使用：
var myViewModel = function(){
var self = this
self.categories = []
$.getJson("/ajax/categories", function(r){
self.categories = r;
}
}
ko.applyBindings(new myViewModel ());
// in html
<select d
浏览 0提问于2015-10-29得票数 0
1回答
我是Knockout.js的新手，我已经创建了一个可观察的数组，并用一些数据进行了初始化。我期望任何时候UI被改变(复选框或文本值)，模型也应该得到更新。
我还订阅了数组。但是我的回调方法从未被调用过。
var viewModel = {
seats:ko.observableArray( [
{ "No": "1", "Booked": "" }, ...
] )
};
viewModel.seats.subscribe(
function(newvalue){
aler
浏览 1提问于2012-06-28得票数 0
回答已采纳
我对Knockout很陌生，并且在一个页面上有一个组件的多个实例。
背景。组件动态地从数据服务获取对象数组。根据用户的操作，组件可能需要重新呈现数组(提供了新的对象)，因此数组是可观察的。
问题。页面上必须有多个组件实例，但是它们必须独立工作。即使最初他们接收到相同的对象数组。
我创造了一个简单的例子来说明这个问题。
HTML
Emulate data service call:
<button data-bind="click: getData">PULL</button><br>
Component 1:
<item-picke
浏览 3提问于2016-10-14得票数 1
回答已采纳
我在试着理解Knockout JS。困扰我的是，我绑定的数据被删除了。这很烦人，因为我想显示从服务器检索的数据。
举个例子：
Name: <span class="name"><?php echo $data->name; ?></span>
结果是：Name: John B
现在，如果我使用Knockout将数据绑定到以下内容：
Name: <span data-bind="text: name" class="name"><?php echo $data->name; ?>
浏览 4提问于2014-06-01得票数 1
我已经创建了一个带有分页选项的页面。代码看起来类似于：
现在我无法在knockout js中向dependentObservable PagedList数据添加排序。
因为PagedList没有Sort()属性..
请帮帮我
浏览 0提问于2013-02-12得票数 1
回答已采纳
我正在尝试使用pubsub消息来通知viewmodel在observablearray上所做的更改。 viewModel1 have observableArray1 viewMOdel2也使用observableArray2 我用它来传播变化： this.observableArray1.subscribe(function (newValue) {
this.observableArray1().push(newValue);
pubsub.notifySubscribers(newValue, "observableArray1&
浏览 13提问于2019-02-25得票数 1
回答已采纳
(每天都有大量的问题链接到为什么我不能设置我的可观察对象的价值，而不是有这么多不同的答案说相同的事情，我想创建一个问题，供每个人参考)
Knockout Observable / Observable Array的设置值不更新
设置我的可观察observableArray的值没有更新！
向可观察数组添加项
为什么我不能将一个项目添加到我的Knockout可观察数组中？
浏览 1提问于2013-10-16得票数 6
回答已采纳
1回答
我仍然是knockout的新手，我正在尝试使用knockout来显示和隐藏引导选项卡。
基本上我有一个计算的观察值：
self.isActive = ko.computed(function () {
var selected = ko.utils.arrayFirst(self.padParticipant(), function (item) {
return item.ParticipationStatus == 'Active';
});
return selecte
浏览 0提问于2013-03-27得票数 3
回答已采纳
1回答
首先，我对使用knockout是个新手。
我已经绑定了array1到我的模板，现在我想将其更改为使用array2，这可以用knockout实现吗？
我搞乱的是什么
var viewModel = function(){
var _this = this;
this.test = [{ name: 'Fruit4'}, {name: 'Vegetables'}];
this.categories = ko.observableArray(this.test);
this.changeItems = function()
浏览 0提问于2013-01-13得票数 0
回答已采纳
我有一个购物车页面，我正在用KnockoutJS 3.4.2构建它。我在最新的Chrome上测试这个。购物车中的产品由Ajax加载。
然后，购物车将被填充一个HTML表。
由于某种原因，当我在TD中绑定'productTitle‘时，它会工作，但是当我试图在一个跨度内绑定它时，它就不会工作了。我也尝试使用模板：<span><!--ko text: productTitle--><!--/ko--></span>，但这也不能工作。
当页面加载时，observableArray可能仍然是空的，这与此有关吗？我发现当我在TD文本中添加'
浏览 1提问于2017-05-27得票数 0
回答已采纳
2回答
我正在用Knockout.js和JayData开发Knockout.js应用程序，在实现拉式刷新数据列表时遇到了一个问题。
我使用OData API查询远程JayData服务，并将结果分配给KO observable数组：
db.MySet
.orderBy('it.Field1')
.skip(recordsToSkip)
.take(20)
.toArray()
.then(function(result) {
self.MyDataList(result);
}
我总是丢掉旧唱片。我怎么才能修正我的代码？
浏览 6提问于2012-12-12得票数 1
回答已采纳
我有一个多维数组，如下所示
"ContactsList":[[{"id":73,"title":"IT Manager"},{"id":74,"title":"Manager"}],
[{"id":75,"title":"Developer"},{"id":76,"title":"Salesperson"},{"id":77,"title":"Per
浏览 1提问于2015-12-10得票数 0
在ajax帖子后，我想显示“您的订单收到:链接”。在用户第一次交互(viewModel中的任何更改)后，我想清除消息。
我如何使用knockout.js做到这一点
查看：
<div data-bind="text:serverResponse,visible:serverResponseActive"></div>
也许是可写的可计算可观测数据？多么?
浏览 1提问于2012-07-27得票数 2
我想基于我的视图模型中的一个数字创建一些链接(或任何html元素)。我想在knockout js Psuedo代码中做同样的事情：
for(var i; i < someNo; i++){
CreateHtmlElement();
}
我以前在Knockout js中使用过foreach绑定，这让我可以基于数组中的对象创建元素，但除了计数之外，我找不到任何可以做同样事情的东西。这个是可能的吗？提前谢谢。
浏览 3提问于2012-12-07得票数 0
回答已采纳
我已经在我的项目中集成了knockout js，现在我在将用户选择的值设置为Dropdown时遇到了一些问题。
代码如下：
<select id="regDobMonth" data-bind="options: RDOBM, optionsText: 'name', selectedOptions: selRDOBM" name="" class="date-sel month" tabindex="3"></select>
JS文件：
RDOBY: ko.observab
浏览 0提问于2014-10-10得票数 3
我不确定我是否在这里做了太多的事情，但这是一个场景。我有一个mvc mvc页面，在第一次加载时，它会使用asp.net框架中的标准foreach机制在视图中返回一个数据表。如果用户启用了javascript，我想使用knockout来更新表。有没有办法让knockout从dom表中读取数据，并将该数据用作初始的可观察集合。从那时起，我将使用knockout和ajax来添加、编辑或删除数据。
简而言之，我需要将一个html表解析为一个击倒可观察的集合。
浏览 0提问于2013-01-11得票数 4
回答已采纳
是否有实用工具可以将数组中每个对象的索引添加为knockout js中的属性？我分两步完成这项工作，我希望在推送到数组的同时为每个对象添加index属性。这是我的代码。
ko.utils.arrayPushAll(array,
ko.mapping.fromJS(result)());
for (var i = 0; i < array.length; i++) {
array[i].index = i;
}
浏览 19提问于2017-10-17得票数 0
我使用的是knockout.js & knockout.mapping.js。我把数据资源改成了ajax，数据不能动态刷新。
由于在实际项目中，我需要在不改变js代码的情况下定制html模块，并且数据不确定，所以数据结构是复杂的和动态的。我想要实现的两个主要目标：
1，多层次数据，所以我使用knockout.mapping，但它不起作用。下面是一个示例：
2、动态源，资源可能有data2, data3, ...，而且我可以很容易地将源ref从data2转换为data3，所以我想我应该在html中使用类似<div data-bind="foreach: resources_
浏览 3提问于2014-06-23得票数 0
参数控制要显示的数据。该参数在视图模型的激活方法中从activationData中检索，并用于对Web方法的调用。数据被返回，并添加到视图模型中，如下所示
define(['durandal/app', 'knockout', 'moment'],
function (app, config, ko, moment) {
var vm = {
app: app
};
vm.activate = function (activationData) {
vm.ChecklistInstanceId =
浏览 3提问于2015-01-04得票数 1
回答已采纳
1回答
我在asp.net应用程序(非MVC)中有一个页面，其中有一些控件--下拉列表和文本框(非服务器端)，以及一个设置了某些属性的json数组。每个元素可以有不同的属性集，但控件是基于这些属性呈现的，如果用户进行了任何更改，json实体也应该相应地进行修改。
这里的挑战是使用相同的控件集，但每次用户单击实体时绑定不同的实体。
问题-在Knockout js中是如何实现的？
如果不是knockout js，那么这个问题的最佳解决方案是什么？
浏览 1提问于2014-03-06得票数 1
我需要使一个网格显示数据，用户选择基于一个下拉菜单使用knockout。例如，如果我的数据集是：
{"Data":[{"Avg. Number of Insects":9, "Percent of Damage to Leaves":67.5},{"Avg. Number of Insects":8, "Percent of Damage to Leaves":33.9},{"Avg. Number of Insects":10, "Percent of Damage to Leaves&#
浏览 0提问于2014-10-17得票数 1
我正在学习如何使用Knockout.js。我想反转显示observableArray内容，所以我以这种方式使用Knockout reverse函数：
<ul data-bind="foreach: anObservableArray.reverse()" >...</ul>
但是，它不工作，也没有错误发生。当我尝试这样做时：
<ul data-bind="foreach: anObservableArray.slice(0).reverse()" >...</ul>
它的工作方式与预期一致。我的问题是，当
浏览 3提问于2013-01-18得票数 6
我有3个级别的数据要在Knockout中管理，但只有前两个级别的数据在添加新数据时进行更新。第三级未更新。
到目前为止，我的代码如下：
有测验，每个测验都包含问题，其中包含答案。我可以添加测验，我可以添加问题，但答案不会更新。
我在网上和stackoverflow上找到的所有示例都只针对两个级别的数据。
我怎样才能让第三级作为一个观察者，让+按钮起作用？
谢谢!
浏览 3提问于2012-10-07得票数 3
回答已采纳
2回答
我有一个淘汰式视图模型，其中有货币和百分比存储为数字(而不是文本)。我想在不同的地方以很好的文本格式显示这些数字。也就是说，其中一些放在独立的span元素中，如下所示：
<span data-bind="formatCurrency: totalOutstandingBalance"></span>
另一些则进入表中，并使用递归来显示它们。我可以使用绑定处理程序来格式化这些值，特别是针对knockout，如下所示(这是有效的)：
ko.bindingHandlers.formatCurrency = {
init: function(el
浏览 0提问于2014-04-24得票数 1
我第一次在MVC中使用了Knockout。我试图显示名称和姓氏，这将是静态的，并将显示，因为他们是定义在控制器类。我已经尽了最大的努力来显示数据，但是它的输出并不像我预期的那样。我的代码如下：模型类
using PerpetuumSoft.Knockout;
using PerpetuumSoft;
using DelegateDecompiler;
namespace MvcApplication20.Models
{
public class Class1
{
public string Number { get; set; }
public string Name
浏览 4提问于2013-09-02得票数 0
2回答
我搞不懂为什么当我向observable数组添加一个元素时，我的UI没有更新。我意识到我没有对AJAX getJSON调用数据做任何事情，但是当我向它添加元素时，是否应该用knockout来更新我的可观察数组呢？它显示"test1“很好，但不显示"test2”。没有PHP或JS错误，它只是不更新UI。
HTML：
<div class="allScheduleWrap" data-bind="foreach: schedules">
<div class="schedule">
&l
浏览 2提问于2012-09-20得票数 0
回答已采纳
1回答
我有一个复选框列表，这些复选框在选中和取消选中时执行函数。我还有一个可观察的数组，它保存当前活动的复选框的值(放到本地存储中)。有关守则如下：
this.layerToggleChecked = knockout.observableArray();
// ...
this.layerToggle = function (source, name, type, url, description) {
return knockout.computed({
read: function () {
return this.layerToggleCh
浏览 2提问于2015-10-02得票数 0
回答已采纳
1回答
敲除绑定复选框组
、、
我有一个动态生成的复选框组，我需要将它绑定到我的knockout视图模型。
下面是我的复选框组代码：
<p>
<label>Properties</label>
<span class="formwrapper">
@{
foreach (ComboProperty item in this.Model.Properties)
{
@:<input type="checkbox" name=
浏览 0提问于2012-08-15得票数 1
回答已采纳
2回答
我要通过Knockout.js在屏幕上显示一个列表
数据看上去像
[{"ID":12345, "Network":"CNN", "Type":"Film", "Severity":"Warning", "Title":"Demo0"},
{"ID":12346, "Network":"Star", "Type":"Film", "Severity":
浏览 2提问于2014-07-31得票数 0
回答已采纳
首先:我是knockout js的新手，正在尝试用knockout/mvvm的方式思考，所以如果我的问题被证明是琐碎的，请原谅我。
我得到的是以下情况:我有一个包含所选票证对象的observableArray的knockout视图模型。此数组表示用户定义的选择/更大票证集的子集。整个票证集都列在一个jqgrid表中，并且每行都有一个复选框，用于说明是否选择了每个票证。这意味着每当"selectedTickets“数组改变时，复选框的值都需要更新。除此之外，我还希望用户能够单击每个复选框，以便从选择添加/删除票证。看起来是一个相当可接受的功能，对吧？
然而，我确实很难理解如何使用knoc
浏览 2提问于2012-06-13得票数 0
回答已采纳
2回答
我正在使用javascritp的一些API，如dojo工具包，谷歌地图API，Arcgis API，...我想通过knockout将对象绑定到视图侧。但是API有自己的特定对象。例如：
一些API：
var map = new Map();
var layer = new BaseMapLayer();
map.add(layer)
var pointLayer = new PointLayer("name", {visible: true});
map.add(pointLayer);
API developer给了我一个PointLayer对象。我还可以在构造函数中设置
浏览 1提问于2014-02-18得票数 1
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
