创建一个通用的isselected解决方案

时间:2013-04-16 19:38:34

标签: knockout.js

我有一个有趣的困境,我还没有找到解决方案......希望有人能指出我正确的方向。

我正在使用knockout / MVVM,我有点厌倦了为我的解决方案中的任何地方发出关于相同数据的ajax请求......所以我决定创建一个小型库来加载和管理公共数据并开始从那里使用它。这很有效。

基于此,我有很多视图,我需要能够选择多个选项并让服务器通知它们。我写了一些逻辑来做到这一点,实质上这通过复选框和检查并在对象上进行选择,现在很好... ...当完成循环数组时,检查isselected并返回一个新的数组与所选对象的ID ...

这就是事情,尽管如此,这很好用。我必须一遍又一遍地为每个实体做这件事......所以,在我的优化心情中,我想......

而不是(例如):

  • 国家/地区((选择了语言+定义的基本功能/对象)
  • CountryList(包含返回所选id的数组和逻辑)
  • 语言(选择语言+定义的基本功能/对象)
  • LanguageList((包含返回所选id的数组和逻辑)
  • .....

我以为我可以尝试制作像...这样的通用解决方案   *基本功能/对象(可以是任何东西(通用):国家,语言,......)   *选择器函数(它包含一个Base对象数组,并在其上选择了添加)

所以我可以这样做:   传入的JSON - > foreach创建BASE对象并放入BASE数组

CreateObservableArrayFunction(Base array),它添加了isselected逻辑,只要它们具有id()属性,就可以返回任何泛型对象的id()。

也应该可以使用此函数在MVC视图中使用它......

注意......同样可以用于过滤等。

也许是一个解释得很糟糕,但我认为这对其他人来说也很有用,而不是一直重复代码。

感谢您的评论。

学家

1 个答案:

答案 0 :(得分:0)

checked绑定也可以与数组一起使用,然后添加/删除该数组中的当前项。

对于您的“国家/地区”示例,您可以使用类似这样的内容。查看型号:

...
vm.CountryList = ko.observableArray(); // list of countries
vm.CountrySelectedIds = ko.observableArray(); // list of country ids 
...

模板:

<div data-bind="foreach: CountryList">
    <input type="checkbox" data-bind="
        attr: {value: Id}, 
        checked: $parent.CountrySelectedIds" />
</div>

如果您的“Id”是一个字符串,这很有效。如果您想存储字符串以外的内容(例如,Country对象本身),请查看我的checkedInArray binding