javascript - 'click' 绑定(bind)不工作 - 无法调用函数 - Knockout.js

Question

我的 View 中有以下内容:

<div data-bind='foreach: providers'>
  <div data-bind='text: name'></div>
  <button data-bind='click: model.addToCart'>Show</button>
  <table class="table">
    <thead>
      <th style="width: 300px">Name</th>
      <th>Price</th>
      <th></th>
    </thead>
    <tbody data-bind='foreach: items'>
      <tr>
        <td data-bind='text: name'></td>
        <td data-bind='text: price'></td>
        <td>
          <input type="button" data-bind='click: model.add' value="Add">
        </td>
      </tr>
    </tbody>
  </table>
</div>

以及我的模型中的以下内容:

function model() {
  var self = this;
  self.providers = data; //some random array data
  self.addToCart = function(place) {
    console.log(place);
  }
};

我在 Knockout.js 中使用了正常的 click 绑定(bind)。

当我运行代码时，似乎甚至没有调用 addToCart 函数。我没有从 console.log() 获得任何值的输出。

我错过了什么？我是初学者。请帮忙。

Answer 1

一旦进入 foreach 循环，您的范围就是您当前正在迭代的对象。因此，要引用父级或根级作用域中的函数，您将不得不使用 $root(尽管 $parent 在这种情况下是相同的):

<button data-bind='click: $root.addToCart'>Show</button>

参见 Documentation