单击绑定不起作用

时间:2015-09-16 18:28:14

标签: javascript html html5 knockout.js

我正在创建这个简单的页面,点击绑定按钮似乎无法正常工作。这是代码:

<!DOCTYPE html>
<html>    
  <head>
        <script type="text/javascript" src = "https://cdnjs.cloudflare.com/ajax/libs/knockout/3.3.0/knockout-min.js"></script> 
  </head>

  <body>
    <div class="banner-bottom" width="100%" >   
    <div class="floatleft"><button  data-bind="click: $root.showActivity">click me </button></div>
    <div class="floatright">
        <div data-bind="if: showActivityMenu">here is a message!</div>      
        <div class="inner"> some values here</div>
    </div>
    <div style="clear:both;"></div>
</div>  
  </body>
<script>
function AAsearchViewModel() {
    var self = this;
    self.showActivityMenu =  ko.observable(true);
    self.showActivity = function () {
        self.showActivityMenu = ko.observable(false);
    };
}

ko.applyBindings(new AAsearchViewModel());

</script>
</html>

在点击绑定上,我尝试同时使用和移除$root$parent,但这对输出没有影响。有什么线索在这里做错了吗?

1 个答案:

答案 0 :(得分:2)

Observables是函数,因此在函数showActivity中,而不是为可观察的showActivityMenu分配新值,您需要将其称为函数来分配新值。更改此代码:

self.showActivity = function () {
    self.showActivityMenu = ko.observable(false);
};

用这个:

self.showActivity = function () {
    self.showActivityMenu(false);
};

您可以在knockout documentation中详细了解可观察的内容以及如何使用它们。请特别注意阅读和编写可观察的

部分