Knockout JS - 数据绑定多个值

时间:2012-07-07 00:05:48

标签: javascript knockout.js

关于JS Knockout库的问题 - 我有三个输入,所有数据都绑定到同一个变量。两个的布尔值为false,一个布尔值为true。 (不幸的是,我无法将它们改为整体,这会使这个问题变得更容易)。虽然这两个虚假输入共享行为,但我需要以某种方式区分它们以触发略微不同的行为。

是否可以将每个数据绑定到另一个具有不同值的变量?所以不是每个人都是

    <input data-Bind="checked:test" value="false">

我会喜欢

    <input data-Bind="test, test2" value="false, 1">

    <input data-Bind="test, test2" value="false, 2">?

我直接尝试了,但没有用,所以我不知道是否可能。非常感谢。

1 个答案:

答案 0 :(得分:4)

您无法直接绑定多个变量,但创建自定义绑定函数可以帮到您。

  

示例:http://jsfiddle.net/gurkavcu/ePW8Y/
  **更改输入值(true,false)以触发更新功能

HTML

<input data-bind="customData: test , v1 : test2"/>
<div>
    <span data-bind ="text : test"/>
</div>
<div>
    <span data-bind ="text : test2"/>
</div>

JS

ko.bindingHandlers.customData = {
      init: function(element, valueAccessor, allBindingsAccessor, viewModel) {  
           $(element).change(function () {
                valueAccessor()(element.value);
            });       
      },
       update: function(element, valueAccessor, allBindingsAccessor, viewModel) {
          var value =ko.utils.unwrapObservable(valueAccessor());
          var v1 = allBindingsAccessor().v1;

          if(value === "true") {
             v1("1"); 
             console.log(v1());
          }
          else  if(value === "false") {
             v1("2"); 
             console.log(v1());
          }
     }
};  


function ViewModel() {

    this.test =  ko.observable(false);
    this.test2 =  ko.observable("2");

};

$(function() {  

    var viewModel = new ViewModel();
    ko.applyBindings(viewModel); 

})​

根据需要修改更新功能。您可以使用v1:...,v2:...,v3:...向绑定添加任意数量的变量,并通过allBindingsAccessor()。v1,allBindingsAccessor()。v2,allBindingsAccessor()。v3 <访问它。 / p>