将对象从NodeJS传递到客户端，然后传递到KnockoutJS视图模型

Question

所以，多亏了SO，我可以将一个对象从节点传递给客户端，但是将它放入一个淘汰视图模型有点尴尬。 这些是我到目前为止的步骤（我已经在我的github项目中包含了相关行的链接。认为上下文可能会有所帮助。）：

1. 应用JSON.stringify并传递给jade文件

    recipeJSON: JSON.stringify(recipe); 

2. 将此包装在头文件中的函数中，该脚本只解析JSON并返回结果

     script function getRecipeObject() { var r = '!{recipeJSON}'; return JSON.parse(r); } 

3. 调用此函数并将结果传递给视图模型构造函数

    self.recipe = ko.observable(new Recipe(getRecipeObject())); 

这有效，但有更好的方法吗？

问题澄清（编辑）：我觉得第2步不应该是必要的。 有没有办法直接将JSON从节点传递给Recipe（）构造函数，而不将getRecipeObject()作为中间步骤？ 我试着像这样直接传递recipeJSON

self.recipe = ko.observable(JSON.parse('!{recipeJSON}'));

这不起作用我认为因为它不是玉模板而且无法访问变量。

Answer 1

根据这个问题的答案，将数据渲染到脚本中是不好的做法，我应该改为在页面加载时进行XHR调用。

Answer 2

编辑

我刚刚看到你链接了一个github回购！ 所以你已经熟悉了大部分内容......你甚至在/recipe/:id/view设置了一个端点，所以现在我真的很困惑......什么不适合你呢？ 只是使用ko.utils.*进行反序列化的最后一步ko.utils.* ？

对所有的展览感到抱歉 - 我认为这比实际情况更为简陋; 我希望那里没有冒犯！

---

您真的不想返回要执行的脚本 - 而是将其视为DTO：仅存储数据的对象（无行为）。 一个例子是：

{
   recipeID: 12,
   reviewIDs: [42, 12, 55, 31],
   rating: 4.2
   recipeName: "A super tasty pie!"
}

此对象（表示）是一个投影 - 存储在数据库中的完整数据的简化版本。

下一步是创建一个端点来访问服务器上的数据。 我们假设您正在使用Express：

var app = express();
app.get('/recipes/:recipeID', function(req, res) {
     var recipeID = req.params.recipeID;

     // It would be cool if this existed, huh?
     getRecipeAsync(recipeID, function(recipe) {
         res.status(200).json(recipe);
     });
});

如果您向（假设的）应用程序发送GET请求（假设它是https：// localhost：8080 / recipes / 12 ），您将获得json代表ID为12的（公认的虚构）食谱。

您可以使用jQuery（或任何其他使XHR漂亮而漂亮的库）来完成JSON的获取

var recipeID = 12;

$.ajax({
   url: "/recipes/" + recipeID,
   type: "GET"
}).then(function(recipe) {
   console.log("Hey! I got the recipe: %O", recipe);

   // Note: you might need to use ko.utils.fromJS(recipe) if the returned
   // data is JSON that ISN'T deserialized into an object
   var recipeObservable = ko.utils.fromJS(recipe);
});

这就是你需要知道的一切。 显然，魔鬼的细节，但这是基本的想法; 如果有帮助，请告诉我！