Javascript 为JSON对象创建CRUD？

我是javascript开发新手，遇到了一个我认为已经解决的问题，但我不知道如何找到答案

假设我有一个JSON对象，如下所示：

// bagelList.json
{
    "description": "The bagel list. Who brings the bagels on what day.",
    "list": [
        {
            "date": "Nov 25",
            "name": "Cory"
        },
        {
            "date": "Nov 26",
            "name": "Jordan"
        }
    ]
}

我想在网页上显示这个对象中的信息，但我想漂亮地显示它，而不是直接打印JSON。我还希望允许用户更新列表、添加新条目、修改描述等

我可以这样显示数据：

$( document ).ready(function() {

    $.getJSON('bagelList.json', function(bagelData) {

        var items = [];
        $.each( bagelData.list, function( index, bagelAssignment ) {
            items.push( "<tr><td contenteditable="true">"
                        + bagelAssignment.date + "</td><td>"
                        + bagelAssignment.name + "</td></tr>" );
        });

        $("tbody#schedule").append( items.join( "" ) );

    });

});

$（文档）.ready（函数（）{
$.getJSON（'bagelList.json'，函数（bagelData）{
var项目=[]；
$.each（bagelData.list，函数（索引，bagelAssignment）{
项目。推送（“”）
+bagelAssignment.date+“”
+bagelAssignment.name+“”）；
});
$（“tbody#schedule”）。追加（items.join（“”）；
});
});

然而，由于嵌入html的特性，所有数据现在都有点模糊了。我可以编写一个解析器来遍历所有的表条目，并在用户更新这些条目后重新创建原始的JSON对象，但这似乎是一个难题

对数据进行建模的正确方法是什么，使其能够以吸引人的方式显示，但保留从对象读取和写入数据的能力

---

我想这个问题以前已经解决过很多次了，所以我不想在编写CRUD的过程中走得太远，结果发现我只需要做XYZ，它就可以工作了。

有像jtable（，）这样的项目

但我的想法是——我认为在有限的情况下，您需要一个带有纯积垢操作的表；通常情况下，它会更具流动性，更针对您的问题/领域。 我会去的。有人也提到了backbone.js，但我认为在angular中它将是无缝的

---

如果你沿着角度的路径走，我建议，那里有很棒的视频。

你描述的功能是由框架提供的，例如，这些框架旨在促进视图（你与用户的界面）与模型（你的JSON对象）的双向绑定。我在这里有点同意。如果您正在寻找一个通过magic“只工作”的框架，而不必连接处理程序来强制改变DOM以响应模型中的更改，那么Angular可能是比Backbone更好的选择。