title: Why is this knockout function being executed?
body: <p>In my view: </p>
  
  <pre><code>&lt;!-- ko if: !isEditingAboutMe() --&gt;
  &lt;p data-bind="text: aboutMe()"&gt;@Model.AboutMe&lt;/p&gt;
  @if (Model.CurrentUserCanEdit)
  {
      &lt;a data-bind="click: editAboutMe"&gt;edit&lt;/a&gt;
  }
  &lt;!-- /ko --&gt;
  &lt;!-- ko if: isEditingAboutMe() --&gt;
  @Html.TextBoxFor(model =&gt; model.AboutMe, new { data_bind = "value: aboutMe" })
  &lt;a data-bind="click: saveAboutMe(userId)"&gt;save&lt;/a&gt;
  &lt;a data-bind="click: cancelAboutMe"&gt;cancel&lt;/a&gt;
  &lt;!-- /ko --&gt;
  
  &lt;script type="text/javascript"&gt;
  $(document).ready(ko.applyBindings(new ProfileVm(@Html.Raw(Json.Encode(Model)))));
  var userId = @Html.Raw(Json.Encode(User.Identity.Name));
  &lt;/script&gt;
  </code></pre>
  
  <p>My viewModel: </p>
  
  <pre><code>function ProfileVm(model) {
  var self = this;
  
  self.aboutMe = ko.observable(model.AboutMe);
  
  self.saveAboutMe = function (username) {
      dataservice().updateAboutMe(username, self.aboutMe());
      self.isEditingAboutMe(false);
  };
  
  self.cancelAboutMe = function() {
      self.isEditingAboutMe(false);
  };
  
  self.isEditingAboutMe = ko.observable(false);
  self.editAboutMe = function() {
      self.isEditingAboutMe(true);
  };
  }
  </code></pre>
  
  <p>When I click "edit", the DOM changes as I'd expect, but saveAboutMe is executed.  It should only be executed if I click 'save', hence the click: binding.  What's going on? </p>