Open Json object в HTML by JQuery. Asp.Net Core

Question

首先，我将展示早期工作版本。

public dynamic Get()
{List<string> myHeadline = new List<string>();
    List<string> myBodyText = new List<string>();
    var s = db2.Post.ToList();
    foreach (var item in s)
    {
        myBodyText.Add(item.BodyText);
        myHeadline.Add(item.Headline);
    }
    var result = new { data1 = myHeadline, data2 = myBodyText};
    return result;
}

和前端的代码

 function getData(data) {
var url = "/api/Blog"
$.getJSON(url, function (data) {
    for (var i = 0; i < data.data1.length; i++) {
        $("#idfirst").after('<div id="post' + i + '" class="post">' +
            '<div id = "posthead' + i + '" class= "posthead"></div>' +
            '<div id="postbody' + i + '" class="postbody"></div>' +
            '<div id="imgPost' + i + '" class="imgPost"></div></div>');
        $("#posthead" + i).append($('<p>').text(data.data1[i]));
        $("#postbody" + i).append($('<p>').text(data.data2[i]));

      });
     }
      $(document).ready(function () {
       getData();
       })

一切都在正常。所有来自数据库的帖子都在HTML上编写。

我决定添加照片并返回对象，例如一个文件 JSON。主代码我不会显示，因为我看不到它的意义。我从类构建的对象，其中是三个属性。法典：

public class GetBlogPost
{
public GetBlogPost()
{
}
public GetBlogPost(string Head, string Body, List<string> imgPost )
{
    this.Headline = Head;
    this.BodyText = Body;
    this.Img64 = imgPost;
}
public string Headline { get; set; }
public string BodyText { get; set; }
public List<string> Img64 { get; set; }
}

然后我将此类的所有完整对象添加到集合中

List<GetBlogPost> resultPost = new List<GetBlogPost>();
mypost = new GetBlogPost(postFromBase[i].Headline, postFromBase[i].BodyText, 
myPostImg);
resultPost.Add(mypost);

并转换为 JSON

var result2 = JsonConvert.SerializeObject(resultPost);
return result2;

在这里，我不想在HTML上打开我的JSON对象。 我尝试了所有案例和组合。最大化它在HTML上拥有的[对象，对象]。

例如，我尝试过这样的

<script>
function getData(data) {
    var url = "/api/Blog"
    window.alert("Hello World")
    $.getJSON(url, function (data) {
        for (var i = 0; i < data.length; i++) {
            $("#idfirst").after('<div id="post' + i + '" class="post">' +
                '<div id = "posthead' + i + '" class= "posthead"></div>' +
                '<div id="postbody' + i + '" class="postbody"></div>' +
                '<div id="imgPost' + i + '" class="imgPost"></div></div>');
            $("#posthead" + i).append($('<p>').text(data[i].Headline));
            $("#postbody" + i).append($('<p>').text(data[i].BodyText));
        }
    });
   }
    $(document).ready(function () {
    getData();
})

在 VS 中，在"返回结果 2"的断点上，它显示正常的 JsonFile

在此处输入图像描述

我读到有一个$.parseJSON(d(; 我如何在我的页面上实现它，也许我在 HTML 上做错了一些？谢谢

Answer 1

这样它就可以使用 $.getJSON

<script>
function getData(data) {
    var url = "/api/Blog"
    $.getJSON(url, function (data)
    {
        var obj = $.parseJSON(data);
        for (var i = 0; i < obj.length; i++)
        {
            $("#idfirst").after('<div id="post' + i + '" class="post">' +
                '<div id = "posthead' + i + '" class= "posthead"></div>' +
                '<div id="postbody' + i + '" class="postbody"></div>' +
                '<div style="width:100%;" id="imgPost' + i + '" class="imgPost"></div></div>');
            $("#posthead" + i).append($('<p>').text(obj[i].Headline));
            $("#postbody" + i).append($('<p>').text(obj[i].BodyText));
            if (obj[i].Img64.length > 0)
            {
                var x = obj[i].Img64.length;
                for (var y = 0; y < x; y++)
                {
                    $("#imgPost" + i).append('<img alt="img" class="imgPost" style="margin:10px;" src="data:image/jpg;base64,' + obj[i].Img64[y] + '" />');
                }
            }  
        }
    });
}
$(document).ready(function ()
{
    getData();
})