title: Getting Issues with trying to pass params to knockout function from view on click
body: <p>So consider the following:</p>
  
  <pre><code>&lt;!-- ko foreach: new Array($root.totalPages()) --&gt;
    &lt;!-- ko if: $index() + 1 === $root.currentPage() --&gt;
    &lt;li class="active"&gt;&lt;a href="#" data-bind="text: $index() + 1"&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;!-- /ko --&gt;
  
    &lt;!-- ko if: $index() + 1 !== $root.currentPage() --&gt;
    &lt;li&gt;&lt;a href="#" data-bind="click: $root.navigateToPageNum.bind($index() + 1), text: $index() + 1"&gt;&lt;/a&gt;&lt;/li&gt;
    &lt;!-- /ko --&gt;
  &lt;!-- /ko --&gt;
  </code></pre>
  
  <p>The important piece is the <code>click: $root.navigateToPageNum.bind($index() + 1), ...</code></p>
  
  <p>The issue is when I throw a <code>console.log</code> in said function, I get undefined.</p>
  
  <pre><code>    self.navigateToPageNum = function(pageNumber) {
        console.log(pageNumber);
      }
  </code></pre>
  
  <p>This gives me undefined which I click on the <code>li</code> link element.</p>
  
  <p>The <code>totalPages()</code> is 7, so I do have 7 <code>li</code> links on the page. but clicking on one gives me undefined. </p>
  
  <p><strong>How can I pass the current index to the function?</strong></p>