anchor.diff:  // #docregion ngModel-6
   .l-sub-section
     :marked
  -    Internally, Angular maps the term `ngModel` to an `ngModel` input property and an
  -    `ngModelChange` output property.
  -    That’s a specific example of a more general pattern in which Angular matches `[(x)]` to an `x` input property
  -    for property binding and an `xChange` output property for event binding.
  +    `[(ngModel)]` is a specific example of a more general pattern in which Angular "de-sugars" the `[(x)]` syntax
  +    into an `x` input property for property binding and an `xChange` output property for event binding.
  +    Angular constructs the event property binding's template statement by appending `=$event` 
  +    to the literal string of the template expression.
  +  code-example(format="." ).
  +    [(x)]="hero.name" &lt;==> [x]="hero.name" (xChange)="hero.name=$event"
  +
   :marked
     Is `[(ngModel)]` all we need? Is there ever a reason to fall back to its expanded form?
   
  -  Well, `NgModel` can only set the target property.
  -  What if we need to do something more or something different when the user changes the value?
  -  Then we need to use the expanded form.
  +  The `[( )]` syntax can only set the data-bound property when the value changes.
  +  If we need to do something more or something different, we need to write the expanded form ourselves.
   
     Let's try something silly like forcing the input value to uppercase:
   // #enddocregion ngModel-6
  
positive.code: // #docregion ngModel-1
  .l-main-section
  :marked
    <a name="ngModel"></a>
    ## Two-way binding with NgModel
    When developing data entry forms, we often want to both display a data property and update that property when the user makes changes.
  
  
negative.code: // #enddocregion directives-ngForTrackBy-3
  
  // #docregion star-template
  <a id="star-template"></a>
  <a id="structural-directive"></a>
  .l-main-section
  :marked
    ## * and &lt;template&gt;
  