Knockout点击绑定与映射插件

时间:2015-09-29 13:26:23

标签: javascript knockout.js

我正在尝试使用click绑定来增加和减去文本绑定中的值。我不知道如何引用myNumber。

HTML:

<a data-bind="click: increment">
    <i class="fa fa-chevron-up"> </i>
</a>
<div data-bind="text: myNumber"></div>
<a data-bind="click: subtract">
    <i class="fa fa-chevron-down"> </i>
</a>

JS:

<script type="text/javascript">
    function increment(result){
        result.myNumber ++;
    }
    function subtract(result){
        result.myNumber --;
    }
    $.getJSON("/app/api/", function(result) {

        function viewModel() {
            return ko.mapping.fromJS(result);
        };

        ko.applyBindings(new viewModel());
    })
    .error(function () { alert("error"); });
</script>

1 个答案:

答案 0 :(得分:0)

您不会将可观察量增加为数字。它是一个二传手/吸气剂。 此外,绑定的函数需要是viewmodel的一部分。您可以在getJSON之前的applyBindings回调中执行此操作。

&#13;
&#13;
vm = {
  myNumber: ko.observable(3),
  increment: function(result) {
    result.myNumber(result.myNumber() + 1);
  },
  subtract: function(result) {
    result.myNumber(result.myNumber() - 1);
  }
};
ko.applyBindings(vm);
&#13;
<link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>
<a href="#" data-bind="click: increment">
  <i class="fa fa-chevron-up"> </i>
</a>
<div data-bind="text: myNumber"></div>
<a href="#" data-bind="click: subtract">
  <i class="fa fa-chevron-down"> </i>
</a>
&#13;
&#13;
&#13;