如何使用knockout.js创建单页应用程序?

时间:2012-01-07 00:43:46

标签: javascript knockout.js

如何组织视图模型类?单独的类或一个巨大的类(以及如何模块化巨人)?如何在“页面”之间切换(当然,数据加载了ajax)?如何在页面加载后加载backbonejs的模板?只要他们在他们的网站上比他们更先进,就会感激示例和教程。

1 个答案:

答案 0 :(得分:10)

哇,很多问题都融为一体。我会尝试在这里点击它们,但是我正在为Knoolout写一个Pluralsight的整个课程的免责声明...所以我不能深入你需要一个评论框:)

1)你如何组织模型视图类?

我认为你的意思是视图模型类。我建议创建一个包含页面所需的所有属性和方法的视图模型。将视图模型放在一个机箱中,并将所有javascript保存在自己的文件中。例如,如果您的结构有页面customers.html,则可以使用您的视图模型的customers.js。

2)单独的类或一个巨大的类(以及如何模块化巨大的类)?

每个视图模型都在自己的文件中。通常每个js文件有1个视图模型(但你肯定可以将相互关联的文件放在同一个文件中)。此外,每个视图通常有1个视图模型(但在某些情况下,您可以再次超出此范围)。

对于模型,您可以根据需要在单个模型文件中创建它们,或将它们放在单独的文件中。对于较小的应用程序,我喜欢1个models.js文件,因为大多数模型都很简单,很小,并且包含简单的属性(尽管可观察到)。但在这里,它确实是一个选择问题。

3)如何在页面之间切换?

该机制并非特定于Knockout,因此您可以使用链接甚至自定义控件(菜单,选项卡等)。你的来电。一旦你决定如何导航到另一个页面,我假设你需要在2之间传递数据用于上下文一种方法是在带有ID的查询字符串中,另一种方式是本地存储(对于需要存储的较大项目)客户),或者还有其他选择。同样,它实际上取决于您需要在页面之间传递的内容。很多时候我设计的页面都是自给自足的,所以我不需要在它们之间传递太多东西。对于我需要通过的内容,我尝试尽可能少地发送并根据密钥查找数据(在ajax调用或本地存储中......数据存在的任何地方)。

我希望这有点帮助。

更新:Here is the link I mentioned to my Knockout.js course on Pluralsight