title: Typescript KnockoutJS Click binding bug
body: <p>Starting out with Typescript and KnockoutJS together and I've hit on a bug I can't reason out yet.
  HTML looks as follows:</p>
  <pre><code>&lt;div class=&quot;panel panel-body&quot;&gt;
      &lt;div class=&quot;list-group&quot; data-bind=&quot;foreach: Items()&quot;&gt;
          &lt;a href=&quot;#&quot; class=&quot;list-group-item&quot;
             data-bind=&quot;text:Name, click: $parent.SetCurrent&quot;&gt;
          &lt;/a&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  <p>Typescript as follows:</p>
  <pre><code>/// &lt;reference path=&quot;knockout.d.ts&quot;/&gt;
  /// &lt;reference path=&quot;jquery.d.ts&quot; /&gt;
  
  module ViewModels {
      export class ItemViewModel {
          public Name: KnockoutObservable&lt;string&gt;;
  
          constructor(name: string) {
              this.Name = ko.observable(name);
          }//constructor
      }
  
      export class MainViewModel {
          public SelectedItem: KnockoutObservable&lt;ItemViewModel&gt;;
          public Items: KnockoutComputed&lt;Array&lt;ItemViewModel&gt;&gt;;
  
          constructor() {
              this.SelectedItem = ko.observable&lt;ItemViewModel&gt;();
              this.Items = ko.computed({
                  owner: this,
                  read: () =&gt; {
                      return this.get_items();
                  }
              });
          }
  
          //TODO: replace this with knockout.mapping plugin transforms
          private convert_from_model(items_model) {
              var arr = new Array&lt;ItemViewModel&gt;();
              var owner = this;
              items_model.forEach(function (item) {
                  var d = new ItemViewModel(item.name);
                  arr.push(d);
              });
              return arr;
          }
  
          private get_items(): Array&lt;ItemViewModel&gt; {
              var items = [{ &quot;name&quot;: &quot;AAAA&quot; }, { &quot;name&quot;: &quot;BBBB&quot; }, { &quot;name&quot;: &quot;CCCC&quot; }, { &quot;name&quot;: &quot;DDDD&quot; }];
  
              var items_c = this.convert_from_model(items);
              return items_c;
          }
  
          public SetCurrent(item: ItemViewModel) {
              this.SelectedItem(item);
          }
      }
  }
  
  window.onload = () =&gt; {
      ko.applyBindings(new ViewModels.MainViewModel());
  };
  </code></pre>
  <p>The problem is setting the current item on click event.</p>
  <pre><code>public SetCurrent(item: ItemViewModel) {
      this.SelectedItem(item);
  }
  </code></pre>
  <p>click event correctly calls <strong>SetCurrent</strong>, but the 'this' is of type <strong>ItemViewModel</strong> not <strong>MainViewModel</strong> as it should be. Am I missing something obvious?</p>
  <p>Here's a <a href="https://github.com/kip9000/TypeScriptHTMLApp1" rel="nofollow noreferrer">VS2013 solution</a> with everything to repro the problem.</p>
  <p>Thanks</p>