显示来自类的JSON

我想在mvc中将我的信息从我的类显示到我的视图中。我想将信息显示为JSON

这就是我的JSON需要的样子：

{
    "timestamp": "2017-06-20 12:12:10",
    "categories":
[
    {
      "name": "Fiction",
    },
    {
      "name": "Roman",    
    }
]
,
    "types":
[
    {
      "name": "Long story",
    },
    {
      "name": "Short story",      
    }
],
    "books":
[
    {
        "title": "Song of ice and fire",
        "bookNumber": "1234567",
        "aisle":
        [
            {
                "location": "fiction isle",
            },
            {
                "location": "roman aisle",
            }
        ]
    }
]
}

这是我创建的类

public class Category
{
    public string name { get; set; }
}

public class Type
{
    public string name { get; set; }
}

public class Aisle
{
    public string location { get; set; }
}

public class Book
{
    public string title { get; set; }
    public string bookNumber { get; set; }
    public List<Aisle> aisle { get; set; }
}

public class RootObject
{
    public string timestamp { get; set; }
    public List<Category> categories { get; set; }
    public List<Type> types { get; set; }
    public List<Book> books { get; set; }
}

和我的观点

@section Scripts{
<script type="text/javascript">
    $("#btnGetBooks").click(function () {
        var actionUrl = '@Url.Action("Testing", "Books")';
        $.getJSON(actionUrl, displayData);
    });

    function displayData(response) {
        if (response != null) {
            for (var i = 0; i < response.length; i++) {
                $("#bookList").append();
            }
        }
    }
</script>

}
<h2>testing</h2>

<input name="btnGetBooks" id="btnGetBooks" type="submit" value="Get Movies">
<p id="bookList"></p>

@节脚本{
$（“#btnGetBooks”）。单击（函数（）{
var actionUrl='@Url.Action（“测试”、“书籍”）；
$.getJSON（actionUrl，displayData）；
});
函数显示数据（响应）{
if（响应！=null）{
对于（变量i=0；i

我不知道构造函数是否可行，但我真的不知道如何在视图中显示数据

---

请帮忙

如果我假设正确，您可以从MVC端正确地获取和填充对象。您可以执行以下操作来更新HTML：

控制器代码：

    public ActionResult Testing()
    {
        List<RootObject> bookList = new List<RootObject>();
        //sample data addition starts
        RootObject rt = new RootObject();
        rt.timestamp = DateTime.Now.ToString();

        List<Aisle> a1 = new List<Aisle>();
        a1.Add(new Aisle { location = "Location" });
        List<Category> c1 = new List<Category>();
        c1.Add(new Category {
            name = "CategoryName"
        });
        List<Models.Type> t1 = new List<Models.Type>();
        t1.Add(new Models.Type
        {
            name = "TypeName"
        });
        rt.categories = c1;
        List<Book> b1 = new List<Book>();
        b1.Add(new Book
        {
            aisle = a1,
            bookNumber = "bookNumber",
            title = "title"

        });
        rt.books = b1;
        rt.types = t1;
        bookList.Add(rt);
        //sample data addition done here
        //OR fill bookList from database or whatever datasource you are using
        return Json(bookList, JsonRequestBehavior.AllowGet);
    }

公共行动结果测试（）
{
List bookList=新列表（）；
//示例数据添加开始
RootObject rt=新的RootObject（）；
rt.timestamp=DateTime.Now.ToString（）；
列表a1=新列表（）；
a1.添加（新通道{location=“location”}）；
列表c1=新列表（）；
c1.增加（新类别）{
name=“CategoryName”
});
列表t1=新列表（）；
t1.添加（新型号。类型
{
name=“TypeName”
});
rt.categories=c1；
列表b1=新列表（）；
b1.添加（新书）
{
通道=a1，
bookNumber=“bookNumber”，
title=“title”
});
rt.books=b1；
rt.types=t1；
图书目录。添加（rt）；
//示例数据添加在这里完成
//或者从数据库或您正在使用的任何数据源中填写图书列表
返回Json（bookList，JsonRequestBehavior.AllowGet）；
}

Javascript代码：

function displayData(response) {
        if (response != null) {
            var strMainBook = '<ul class="yourclass">';
            for (var i = 0; i < response.length; i++) {
                strMainBook += '<li>' + response[i].timestamp + '</li>';
                var strBookCategory = '<ul class="yourclass">';
                for (var j = 0; j < response[i].categories.length; j++) {

                    strBookCategory += '<li>' + response[i].categories[j].name + '</li>';

                }
                strBookCategory += '</li>';
                strMainBook += strBookCategory;

                var strBookType= '<ul class="yourclass">';
                for (var j = 0; j < response[i].types.length; j++) {
                    strBookType += '<li>' + response[i].types[j].name + '</li>';
                }
                strBookType += '</li>';
                strMainBook += strBookType;
                strMainBook += '</ul>'
                $("#bookList").append(strMainBook);
            }
        }
    }

功能显示数据（响应）{
if（响应！=null）{
var strMainBook='
'；
对于（变量i=0；i'；
var strBookCategory='
'；
对于（var j=0；j'；
}
strBookCategory+=''；
标准图书+=标准图书类别；
var strBookType='
'；
对于（var j=0；j'；
}
strBookType+=''；
strMainBook+=strBookType；
strMainBook+='
'
$（“#书目”）。追加（标准手册）；
}
}
}

如果我假设正确，您可以从MVC端正确地获取和填充对象。您可以执行以下操作来更新HTML：

控制器代码：

    public ActionResult Testing()
    {
        List<RootObject> bookList = new List<RootObject>();
        //sample data addition starts
        RootObject rt = new RootObject();
        rt.timestamp = DateTime.Now.ToString();

        List<Aisle> a1 = new List<Aisle>();
        a1.Add(new Aisle { location = "Location" });
        List<Category> c1 = new List<Category>();
        c1.Add(new Category {
            name = "CategoryName"
        });
        List<Models.Type> t1 = new List<Models.Type>();
        t1.Add(new Models.Type
        {
            name = "TypeName"
        });
        rt.categories = c1;
        List<Book> b1 = new List<Book>();
        b1.Add(new Book
        {
            aisle = a1,
            bookNumber = "bookNumber",
            title = "title"

        });
        rt.books = b1;
        rt.types = t1;
        bookList.Add(rt);
        //sample data addition done here
        //OR fill bookList from database or whatever datasource you are using
        return Json(bookList, JsonRequestBehavior.AllowGet);
    }

公共行动结果测试（）
{
List bookList=新列表（）；
//示例数据添加开始
RootObject rt=新的RootObject（）；
rt.timestamp=DateTime.Now.ToString（）；
列表a1=新列表（）；
a1.添加（新通道{location=“location”}）；
列表c1=新列表（）；
c1.增加（新类别）{
name=“CategoryName”
});
列表t1=新列表（）；
t1.添加（新型号。类型
{
name=“TypeName”
});
rt.categories=c1；
列表b1=新列表（）；
b1.添加（新书）
{
通道=a1，
bookNumber=“bookNumber”，
title=“title”
});
rt.books=b1；
rt.types=t1；
图书目录。添加（rt）；
//示例数据添加在这里完成
//或者从数据库或您正在使用的任何数据源中填写图书列表
返回Json（bookList，JsonRequestBehavior.AllowGet）；
}

Javascript代码：

function displayData(response) {
        if (response != null) {
            var strMainBook = '<ul class="yourclass">';
            for (var i = 0; i < response.length; i++) {
                strMainBook += '<li>' + response[i].timestamp + '</li>';
                var strBookCategory = '<ul class="yourclass">';
                for (var j = 0; j < response[i].categories.length; j++) {

                    strBookCategory += '<li>' + response[i].categories[j].name + '</li>';

                }
                strBookCategory += '</li>';
                strMainBook += strBookCategory;

                var strBookType= '<ul class="yourclass">';
                for (var j = 0; j < response[i].types.length; j++) {
                    strBookType += '<li>' + response[i].types[j].name + '</li>';
                }
                strBookType += '</li>';
                strMainBook += strBookType;
                strMainBook += '</ul>'
                $("#bookList").append(strMainBook);
            }
        }
    }

功能显示数据（响应）{
if（响应！=null）{
var strMainBook='
'；
对于（变量i=0；i'；
var strBookCategory='
'；
对于（var j=0；j'；
}
strBookCategory+=''；
标准图书+=标准图书类别；
var strBookType='
'；
对于（var j=0；j'；
}
strBookType+=''；
strMainBook+=strBookType；
strMainBook+='
'
$（“#书目”）。追加（标准手册）；
}
}
}

您可以在上看到副本！您可以包括ImportBooks的实现吗？您没有显示ImportBooks的模型，但是您显示的json与

RootObject

匹配，因此如果您希望传递给视图的是这个json，那么它的

RootObject模型=new RootObject（）；//设置一些返回Json的属性（model，JsonRequestBehavior.AllowGet）RootObject

，所以循环没有意义（它不是集合）。您想向

元素添加什么（一些

元素包含

根对象的值？

？您需要解释您想要的结果is@mike91如果是JSON或JSON，则不会调用构造函数