0

ノックアウト 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
    }
4

2 に答える 2

0

あなたのコードを見ると、ASP.NET WebAPI を使用していると思います。ajax 呼び出しアドレスを から/api/RosterApiControllerに変更する必要があります/api/RosterApi

ASP.NET MVC と ASP.NET WebAPI の両方に、サフィックスのないコントローラー名を除くルーティング規則があります。 Controller

于 2013-03-29T20:47:35.763 に答える
0

Slawomir ソリューションは間違いなく知っておくべきことだと思いますが、foreach を使用して RosterUsers を設定することができます。

_.each(data, function(user){
    self.RosterUsers.push(new RosterUserObject(user));
});
于 2013-03-29T22:24:54.063 に答える