在Sammy路线中使用KnockoutJS observableArray

我正在搜索屏幕上工作，用户可以在其中选择几个选项并获得结果。当用户选中一个复选框时，会发出一个AJAX请求并将结果显示在屏幕上。因此，搜索没有“搜索”按钮，查询在选择选项时开始。在Sammy路线中使用KnockoutJS observableArray

我为UI和Sammy使用KnockoutJS路由。搜索选项绑定到observableArray。问题是我不知道我可以在哪里设置location.hash。我现在使用的是订阅功能。在KnockoutJS教程中，我看到click是绑定到设置散列的函数，但在这里我不认为需要为每个复选框创建点击函数，我也相信太多了。

这里Fiddle

HTML：

<input type="checkbox" value="1" data-bind="checked:sizeOptions" /> Size 1 
    <br /> 
<input type="checkbox" value="2" data-bind="checked:sizeOptions" /> Size 2 
    <br /> 

<br /> 
 
<div data-bind="text: ko.toJSON($root.sizeOptions)"></div> 
Calls: <div data-bind="text: $root.calls"></div>

型号：

function SearchModel() { 
    var self = this; 
    self.calls= ko.observable(0); 
    self.sizeOptions = ko.observableArray([]); 

    // Should this be a Behaviour? (like click: goToFolder). This would be called on the Sammy rout also 

    self.sizeOptions.subscribe(function() { 
     var _calls = self.calls(); 
     _calls = _calls + 1; 
     self.calls(_calls); 
     location.hash = "o=" + self.sizeOptions().join(); 
     console.log("subscribe"); 
    }); 

    Sammy(function() { 
     this.get('#o=:o', function() { 
      self.sizeOptions(this.params.o.split(',')); 
      console.log("Sammy get"); 
      // do an AJAX request and place the results in an observableArray 
     }); 

    }).run(); 
} 
ko.applyBindings(new SearchModel());

来源

2012-08-09 Adrian Iftode

您的jsfiddle链接转到空白页。你能修好它吗？ – Luffy 2012-08-09 21:29:52

@Luffy，修好了，谢谢 – 2012-08-10 04:29:32

此修复程序是简单而有效的。我没有使用“订阅”方法，而是添加了一个ko.computed调用，其中我设置了散列。

这一呼吁饰有“油门”扩展，所以当多个相关的可观察的同时无形中改变，哈希将被设置一次，所以森美将拦截只有一次的路线，大的，除非这涉及AJAX请求。

这里Fiddle

来源

2012-08-15 19:34:14

在Sammy路线中使用KnockoutJS observableArray

回答

相关问题