1

几周以来我一直在使用 Knockout.js 做示例和其他教程，但我仍在试图弄清楚如何在我正在开发的应用程序上构建所有内容。这是一个简单的学校后端应用程序，可以保存所有班级、成绩、教师、出勤率和学生的列表。它有多个页面：

  • 所有类的列表（您可以在其中添加/编辑/删除类）
  • 每个班级都有一个学生列表（您可以在其中添加/编辑/删除学生）
  • 每个学生都有他/她的出勤和成绩清单
  • 教师页面
  • 学校科目页面
  • 和别的 ...

我该如何构建这个应用程序？我已经通过创建类模型开始了“类”页面：

function Class(data) {
  var self = this;

  self.id = data.id;
  self.name = ko.observable(data.name);
  self.students = data.students;
  self.attendance = data.attendance;
}

...和一个加载初始内容（类列表）的类 ViewModel。它还包含添加、编辑和删除类的功能。

function ClassViewModel() {
  var self = this;

  self.classes = ko.observableArray(ko.utils.arrayMap(classArr, function(eachClass) {
    return new Class(eachClass);
  }));

  [...]
}

那么我是否继续为应用程序的每个主要部分（学生、教师、科目等）做一个单独的模型和视图模型，并将它们分别绑定在自己的页面上？如果我走这条路，我如何在 ViewModel 之间共享功能而不给每个 ViewModel 添加相同的功能？

4

1 回答 1

-1

我为 KO 创建了一个名为 Knockout.BindingConventions 的配置库约定。

https://github.com/AndersMalmgren/Knockout.BindingConventions/wiki

使用 nuget 安装

Install-Package Knockout.BindingConventions

该库的一个特点是它的模板约定，基本上它理解一个名为ClassViewModel的视图模型应该连接到一个名为 ClassView 的模板（视图）

http://jsfiddle.net/xJL7u/

我还创建了一个模板引导程序，它利用了上面的库 https://github.com/AndersMalmgren/Knockout.Bootstrap/wiki

使用 nuget 安装

Install-Package Knockout.Bootstrap

结合这两个库，您可以在服务器上像这样构建您的应用程序（以您的 ClassViewModel 为例）

app
    Class
        ClassViewModel.js
        OtherViewModel.js
    Shared
        DatePickerViewModel.js
views
    Class
        ClassView.htm
        OtherView.htm
    Shared
        DatePickerView.htm

完整的 MVC4 演示在这里 https://github.com/AndersMalmgren/Knockout.Bootstrap.Demo

于 2013-06-28T07:51:23.643 回答