Question

我有两个if绑定用于在HTML页面中显示一个div用于登录而未登录用户，因此它们将具有不同的信息。

<div class="col-md-12" data-bind="if: loggedIn() != 'true'">

<div class="col-md-9" data-bind="ifnot: loggedIn() != 'true'">

所以我希望登录用户有一个不同的列和不同的文本，然后登录用户。但是在我使用这个数据绑定后，它没有显示任何内容。我也试过了data-bind="visible"。同样的问题。顺便说一句，loggedIn（）是一个字符串。

Answer 1

因为你把第二个div放在第一个div中，所以每当第一个div条件为true时，它的内容都会显示出来，但是在这种情况下你的内部div有自己的内容，如果没有显示。你需要取出你的第二个div在外面或以一种它们不会相互重叠的方式构造它。

实施例：https://jsfiddle.net/kyr6w2x3/45/

<div class="col-md-12" data-bind="if: loggedIn() != 'true'">
  Hello I am not logged in
</div>

<div class="col-md-9" data-bind="ifnot: loggedIn() != 'true'">
  Hi I am logged in 
</div>

<div>
<input type="button" data-bind="click:toggle" value="toggle">
</div>

 function ViewModel() {
    var self = this;
   self.loggedIn = ko.observable('true');

   self.toggle = function (){
     if(self.loggedIn() == 'true'){
     self.loggedIn('false');
     }else{
     self.loggedIn('true');
     }
   }
  }  
  ko.applyBindings(new ViewModel());

两个如果绑定在淘汰赛中没有显示div

1 个答案: