title: Why has this bound knockout element become undefined?
body: <p>Building a page using TypeScript and Knockout. When the page loads, the viewmodel creates and assigns a value to a "vehicles" array of objects.</p>
  
  <pre><code>vehicles: KnockoutObservableArray&lt;Vehicle&gt;;
  
  constructor() {
      // uses and API to fetch data into a "vehicleData" array
      this.vehicles = ko.observableArray(vehicleData);
  }
  </code></pre>
  
  <p>And in the page itself this is bound to an element which includes a "remove" button:</p>
  
  <pre><code>&lt;div data-bind="foreach: vehicles"&gt;
      &lt;div data-bind="text: model"&gt;&lt;/div&gt;
      &lt;button data-bind="click: $parent.removeVehicle"&gt;Remove&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>This is all fine. What I don't understand is what happens when removeVehicles in invoked. Here it is:</p>
  
  <pre><code>removeVehicle(vehicle): void {
      this.vehicles.remove(vehicle);
  }
  </code></pre>
  
  <p>It passes in the parameter as expected, but when it tries to remove, it claims that "vehicles" no longer exists.</p>
  
  <pre><code>Uncaught TypeError: Cannot read property 'remove' of undefined
      at Object.VehicleManagementViewModel.removeVehicle
      at HTMLButtonElement.&lt;anonymous&gt; (knockout-latest.js:99)
  </code></pre>
  
  <p>What's caused the array to become undefined? How can it be undefined, when the HTML element is bound to it correctly? </p>