2015-04-02 83 views
0

尝试使用基于两个标志的数据绑定绑定启用状态。如果flagA为真,并且flagB为假,则需要启用输入框。使用多个布尔可观察标志启用绑定

var viewModel = function() { 
 
    var self = this; 
 
    self.flagA = ko.observable(true); 
 
    self.flagB = ko.observable(false); 
 
    self.changeState = function() { 
 
     self.flagA(false); 
 
    } 
 
} 
 
    
 
ko.applyBindings(viewModel);
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script> 
 
<input type='text' data-bind='enable: flagA && !flagB' /> 
 
<button data-bind='click:changeState'>changeState</button>

任何一个可以帮助我了解为什么它不工作?

我试过使用像enable:function(){flagA && !flagB}这样的功能来完成这项工作。但它不起作用:当我使用按钮改变状态时,它没有观察到。

回答

3

因为flagAflagB是观测(其功能),你需要给他们打电话,没有任何说法,如果你在表达式中使用他们到那里值:

<input type='text' data-bind='enable: flagA() && !flagB()' /> 

演示JSFiddle

+0

太好了!它工作正常。你是正确的解开布尔:) – 2015-04-02 08:37:10

3

尽量避免将逻辑放在您的视图中,这是一个不好的做法。为了做到这一点添加computed变量

self.isEnabled = ko.computed(function() { 
     return this.flagA() && !this.flagB() 
    }, this); 

,并将其绑定像往常一样:

<input type='text' data-bind='enable: isEnabled' /> 

fiddle