c# - .net 核心 MVC knockout c#

Question

尝试使用 Knockout 填充表格。

Controller :

public JsonResult GetAllStudents()
        {
            using (HttpClient client = new HttpClient())
            {
                client.BaseAddress = new Uri(_apiInfo.Urlapi);
                MediaTypeWithQualityHeaderValue contentType =
                    new MediaTypeWithQualityHeaderValue("application/json");
                client.DefaultRequestHeaders.Accept.Add(contentType);
                HttpResponseMessage response = client.GetAsync("/api/students").Result;
                string stringData = response.Content.ReadAsStringAsync().Result;
                if (response.IsSuccessStatusCode)
                {
                    return Json(stringData);
            }
            return null;
        }
    }

查看:

<table>
    <thead>
    <tr><th>Last name</th></tr>
    </thead>
    <tbody data-bind="foreach: people">
    <tr>
        <td data-bind="text: $data.lastName"></td>
    </tr>
    </tbody>
</table>

脚本:

 function AppViewModel() {
        var self = this;
        self.people = ko.observableArray([]),
            $.ajax({
                type: "GET",
                url: '@Url.Action("GetAllStudents", "Konckout")',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (data) {
                    self.people(data);
                },
                error: function (err) {
                    alert(err.status + " : " + err.statusText);
                }
            });
        }
    ko.applyBindings(new AppViewModel());

我使用 alert(data) 测试了返回值，得到以下信息:

[{"id":1,"lastName":"Alexander"},{"id":1,"lastName":"Mike"}]

但是表中没有显示任何数据!

Answer 1

如果您的 alert(data); 确实给您一个看起来像 [{"id":1,"lastName":"Alexander"},{"id":1,"lastName":"Mike"}] 那么您的 ajax 调用可能会返回一个字符串而不是 json。在将数据填充到 people 对象之前尝试解析您的数据。

self.people(JSON.parse(data));

jsFiddle

如果这解决了问题，那么我认为真正的问题是您的 Controller 方法对数据进行了双重编码。您从已经是 JSON 的外部 API 获得响应，然后通过在 JsonResult 中返回该响应来重新序列化该响应。基于此其他SO question您应该更改 Controller 方法以返回 ContentResult 而不是 JsonResult。