title: Property is not defined when using if binding referring to $root inside with binding in Knockout
body: <p>I'm pretty sure I'm missing something as far as context, but I just can't figure out what.</p>
  
  <p>I have the following ViewModel:</p>
  
  <pre><code>var ViewModel = function(){
      var self = this;
      self.person = ko.observable();
      self.isPerson = ko.observable();
  
      self.person.subscribe(function(value){
          self.isPerson('firstName' in value);
      });
  };
  
  var vm = new ViewModel();
  var personA = { };
  var personB = { firstName: ko.observable("hello") };
  
  vm.person(personA);
  ko.applyBindings(vm);
  setTimeout(function(){ vm.person(personB); }, 1000);
  </code></pre>
  
  <p>and the following View:</p>
  
  <pre><code>&lt;span data-bind="with: person"&gt;
      &lt;!-- ko if: $root.isPerson --&gt;
          &lt;span data-bind="text: firstName"&gt;&lt;/span&gt; 
      &lt;!-- /ko --&gt;    
  &lt;/span&gt;
  </code></pre>
  
  <p><a href="http://jsfiddle.net/mdavis/73Xxs/16/" rel="nofollow">JSFiddle</a></p>
  
  <p>Once the timeout executes, I'd expect the firstName to be shown in the view, however, I get the following error:</p>
  
  <pre><code> firstName is not defined;
  </code></pre>
  
  <p>If I start out with personB in the viewModel, it works. If I move the if statement above the with statement, it works.</p>
  
  <p>What am I doing wrong in this scenario?</p>
  
  <p><strong>Updated <a href="http://jsfiddle.net/mdavis/73Xxs/17/" rel="nofollow">JSFiddle</a></strong></p>