feat(core): separate refs from vars.

Introduces `ref-` to give a name to an element or a directive (also works for `<template>` elements), and `let-` to introduce an input variable for a `<template>` element.

BREAKING CHANGE:
- `#...` now always means `ref-`.
- `<template #abc>` now defines a reference to the TemplateRef, instead of an input variable used inside of the template.
- `#...` inside of a *ngIf, … directives is deprecated.
  Use `let …` instead.
- `var-...` is deprecated. Replace with `let-...` for `<template>` elements and `ref-` for non `<template>` elements.

Closes #7158

Closes #8264

modules/benchmarks/src/naive_infinite_scroll/app.ts

@@ -19,7 +19,7 @@ import {Component, Directive} from 'angular2/core';
     </div>
     <div template="ngIf scrollAreas.length > 0">
       <p>Following tables are only here to add weight to the UI:</p>
-      <scroll-area template="ngFor #scrollArea of scrollAreas"></scroll-area>
+      <scroll-area template="ngFor let scrollArea of scrollAreas"></scroll-area>
     </div>
   </div>`
 })

modules/benchmarks/src/naive_infinite_scroll/cells.ts

@@ -55,7 +55,7 @@ export class Stage {
   directives: [NgFor],
   template: `
       <div [style.width.px]="cellWidth">
-          <button template="ngFor #stage of stages"
+          <button template="ngFor let stage of stages"
                   [disabled]="stage.isDisabled"
                   [style.background-color]="stage.backgroundColor"
                   on-click="setStage(stage)">

modules/benchmarks/src/naive_infinite_scroll/scroll_area.ts

@@ -28,7 +28,7 @@ import {NgFor} from 'angular2/common';
             <div id="padding"></div>
             <div id="inner">
                 <scroll-item
-                    template="ngFor #item of visibleItems"
+                    template="ngFor let item of visibleItems"
                     [offering]="item">
                 </scroll-item>
             </div>