使用knockout js在页面上显示数据时出现问题-数据不显示
trouble using knockout js to display data on page - data not showing
这是我第一次工作和尝试淘汰js,我有麻烦让它工作。我正在做的是显示从数据库返回的列表/集合-基本上是所有用户的信息。
问题:与我所写的到目前为止,我没有得到的数据显示在页面上,不知道我做错了什么或失踪。如果我缺少任何其他代码,这将有助于解决我的问题,让我知道。谢谢!
视图页面
@using ProjectB.Shared.Models
@using System.Collections
@using ProjectB.Shared.Services
<html>
<head>
<script type ="text/javascript" src="~/Scripts/jquery-1.9.1.min.js"></script>
<script src="~/Scripts/knockout-2.2.1.js"></script>
<script src="~/Scripts/knockout.mapping-latest.js"></script>
</head>
<body>
<table data-bind="visible: RosterUsers().length>0">
<thead>
<tr>
<td>Name</td>
<td>Content Role</td>
<td>Email</td>
<td></td>
</tr>
</thead>
<tbody data-bind="foreach: RosterUsers">
<tr>
<td><span data-bind="text: Name"></span></td>
<td><span data-bind="text: ContentRole"></span></td>
<td><span data-bind="text: Email"></span></td>
</tr>
</tbody>
</table>
<script type ="text/javascript">
var rUserViewModel = function () {
var self = this;
self.Name = ko.observable("");
self.ContentRole = ko.observable("");
self.Email = ko.observable("");
var rUserData = {
Name: self.Name,
ContentRole: self.ContentRole,
Email: self.Email
};
self.RosterUsers = ko.observableArray([]);
GetRosterUser();
function GetRosterUser() {
$.ajax({
type: "GET",
url: "/api/RosterApiController",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (data) {
self.RosterUsers(data);
},
error: function (error) {
alert(error.status + " <--and--> " + error.statusText);
}
});
}
};
ko.applyBindings(new rUserViewModel());
</script>
</body>
</html>
public partial class RosterVw
{
public RosterVw()
{
this.Users = new HashSet<RosterUser>();
}
public ICollection<RosterUser> Users { get; set; }
}
public partial class RosterUser
{
public string Name { get; set; }
public ContentRoles ContentRole { get; set; }
public string Email { get; set; } //Photo is unique to email address
}
看看你的代码,我想你是使用ASP。净之前。我认为你应该把你的ajax调用地址从/api/RosterApiController
改为/api/RosterApi
。
ASP。asp.net MVC和ASP。. NET WebAPI有路由约定,除了控制器名没有 Controller
后缀。
我认为Slawomir的解决方案绝对是你应该知道的,但你可以尝试使用foreach填充你的RosterUsers。
_.each(data, function(user){
self.RosterUsers.push(new RosterUserObject(user));
});
相关文章:
- 如何将json数据显示为html
- 解耦按钮(两个按钮同时切换),并根据数据显示相应的按钮
- 将json提要数据显示为html
- 使用Ajax Get方法将数据显示到特定元素中
- 如何将数据显示为线性highChart
- Json显示来自网站的数据显示仅未定义
- 使 ajax 请求和成功数据显示在 id <选择>选择>部分中
- 在按钮单击时将图像URL数据显示到弹出框中,而无需禁用背景
- 如何在循环中将 json 数据显示为 HTML
- 如何使用javascript在html中将firebase数据显示为列表
- PHP同时循环数组数据显示到javascript中
- 原始图像数据显示
- 如何在 y 轴上将数据显示为 KB、MB、GB、TB
- Ajax 数据显示在包含 10 行的表中
- 如何让 Mathjax.js 与 ANCII.js 将附加的 json 数据显示为正确的公式
- 调用 Worklight 适配器并将列表视图中的 JSON 数据显示为字符串
- Jquery/Javascript Datatables : 如何在行选择时将行数据显示到 html 文本字段中
- 双击 td 时,如何在警告框中将数据库中的数据显示为 html 表
- 日期之间的数据显示所有头
- 如何使用模板中的数据显示谷歌地图