knockout.js - 更新 knockout.js 和 SignalR 库后,knockout-mapping js 不会更新视图中的列表
问题描述
我有以下代码。但不更新视图页面。
在我的 app.js
// Hub 回调:更新用户列表
hub.client.updateUserList = function (userList) {
viewModel.setUsers(userList);
};
在我的 viewmodel.js 中
var viewModel = {
Users: ko.mapping.fromJS([]),
}
viewModel.setUsers = function (userArray) {
ko.mapping.fromJS(userArray, viewModel.Users);
};
我的 SignalR 集线器类
private void SendUserListUpdate()
{
Users.ForEach(u => u.InCall = (GetUserCall(u.ConnectionId) != null));
Clients.All.updateUserList(Users);
}
此 signalR SendUserListUpdate() 正确更新用户列表。但不在下面的索引页面中更新。
<div class="well user-list">
<ul class="nav nav-list">
<li class="nav-header">Online Users <small data-bind="text: Users().length"></small></li>
<!-- ko foreach: Users -->
<li class="user" data-bind="attr: { 'data-cid': ConnectionId, 'title': Username }">
<a href="#">
<!-- only using an a here for bootstrap styling -->
<div class="username" data-bind="text: Username"></div>
<div class="helper" data-bind="css: $parent.getUserStatus($data)"></div>
</a>
</li>
<!-- /ko -->
</ul>
</div>
我使用的脚本。
<script src="~/Scripts/adapter.js"></script>
<script src="~/Scripts/jquery-3.3.1.min.js"></script>
<script src="~/Scripts/knockout-3.4.2.js"></script>
<script src="~/Scripts/knockout.mapping-latest.js"></script>
<script src="~/Scripts/alertify.min.js"></script>
<script src="~/Scripts/WebRtcDemo/bootstrap.min.js"></script>
<script src="~/Scripts/jquery.signalR-2.3.0.min.js"></script>
解决方案
从服务器映射新数组数据时添加映射对象参数。此外,您可以通过 ko.observableArray([]); 创建可观察数组。
var viewModel = {
Users: ko.observableArray([]),
}
viewModel.setUsers = function (userArray) {
ko.mapping.fromJS(userArray, {}, viewModel.Users);
};
推荐阅读
- python - 如何将由列表组成的数据框拆分为不同的列?
- r - 无法将值分配给 R 中数据框的新列
- java - 使用 Spring JPA 在 H2 和 Sql Server 中持久化的 Java UUID
- python - 使用相同的 URL 但不同的标签抓取多个 html 表
- android - 设置Android工具栏overFlow菜单样式的问题(带笔划线的圆角)
- javascript - 将javascript生成的innerhtml存储在数据库中的最佳方法是什么?
- python - 忽略 python 正则表达式匹配中的特定字符
- pytest - Pytest 无法导入源文件。我究竟做错了什么?
- python - PIL & NumPy 数组——基于颜色(黑白)提取形状
- javascript - 为什么我检查数据库中是否已存在用户的函数总是返回false?