anchor.diff:  
     ### Property Binding or Interpolation?
     We often have a choice between Interpolation and Property Binding. The following binding pairs do the same thing
  -  
  +
   +makeExample('template-syntax/ts/app/app.component.html', 'property-binding-vs-interpolation')(format=".")
   :marked
     Interpolation is actually a convenient alternative for Property Binding in many cases.
  
positive.code: +makeExample('template-syntax/ts/app/app.component.html', 'var-form-a')
  :marked
    What is the value of `theForm`?
    
    It would be the [HTMLFormElement](https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement) 
    if Angular hadn't taken it over.
    It's actually `ngForm`, a reference to the Angular built-in `NgForm` directive that wraps the native `HTMLFormElement`
    and endows it with additional super powers such as the ability to
    track the validity of user input.
  
    This explains how we can disable the submit button by checking `theForm.form.valid` 
    and pass an object with rich information to the parent component's `onSubmit` method.
  
  <a id="inputs-outputs"></a>
  
negative.code:   The (#) prefix character in front of "hero" means that we're defining a `hero` variable.
  .l-sub-section
    :marked
      Some folks don't like the (#) character.
      The `var-` prefix is the  “cannonical” alternative to "#". We could have declared our variable as `var-hero`.
  :marked
    We defined `hero` on the outer `<template>` element where it becomes the current hero item
    as Angular iterates through the list of heroes.
  
    The `hero` variable appears again in the binding on the inner `<hero-detail>` component element.
    That's how each instance of the `<hero-detail>` gets its hero.
  
    ### Referencing a local template variable
  
    We can reference a local template variable on the same element, on a sibling element, or on
    any of its child elements.
  
  