更新淘汰观察

时间:2017-02-10 17:13:34

标签: javascript knockout.js

我在更新淘汰赛可观察价值方面遇到了一些麻烦。我需要将linkClick中的值传递给showMenu。

当我像这个showMenu(“Value”)手动更新showMenu时,Value将被传递给视图。然而,它需要是一个动态值。这基本上就是我的代码。

//View
<a data-bind="click: linkClick" data-sec="Value">Click Me</a>

<!-- ko if: showMenu() === 'Value' -->
    <ul class="Menu">
        <li>Link 1</li>
        <li>Link 2</li>
    </ul>
<!-- /ko -->

define(
  [''],
  function () {
    var _this = this;
    return {

        showMenu: ko.observable(""),
        linkClick: function(data, event) {

            var element = event.target,                    
                Menu = $(element).attr('data-sec');

            var myMenu = this.showMenu();
            this.showMenu(Menu);

        }
    }
});

我也尝试在全局范围内使用 _this 而不是 this 但是这会产生_this.showMenu()不是函数错误。请帮忙。

PS。我必须在第一个函数定义中写入所有内容。

1 个答案:

答案 0 :(得分:2)

使用data(这是您的viewmodel)而不是this

function vm() {
  return {
    showMenu: ko.observable(""),
    linkClick: function(data, event) {
      var element = event.target,
        Menu = $(element).attr('data-sec');

      // use data instead of this
      data.showMenu(Menu);
    }
  }
}

ko.applyBindings(vm());
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<a data-bind="click: linkClick" data-sec="Value">Click Me</a> 
<!-- ko if: showMenu() === 'Value' -->
<ul class="Menu">
  <li>Link 1</li>
  <li>Link 2</li>
</ul>
<!-- /ko -->