anchor.diff:      td
         :marked
           ### ng-model
  +        ### ng-model
         code-example(format="").
           &lt;input ng-model="vm.favoriteHero"/>
         :marked
  +        AngularJS에서 `ng-model` 지시자가 폼 컨트롤을 템플릿과 연결된 컨트롤러의 프로퍼티에 바인딩합니다.
  +        이렇게하면 **양방향 바인딩**이 제공되어 뷰의 값에 대한 모든 변경 사항이 모델과 동기화되고
  +        모델 변경 사항이 뷰의 값과 동기화됩니다.
  +
           In AngularJS, the `ng-model` directive binds a form control to a property in the controller associated with the template.
           This provides **two-way binding**, whereby any change made to the value in the view is synchronized with the model, and any change to the model is synchronized with the value in the view.
       td
         :marked
           ### ngModel
  +        ### ngModel
         +makeExample('cb-ajs-quick-reference/ts/src/app/movie-list.component.html', 'ngModel')(format="." )
         :marked
  +        Angular에서 **양방향 바인딩**은 `[()]`로 표시되며, "상자 안 바나나"라고도 묘사됩니다.
  +        이 구문은 (컴포넌트에서 뷰로의) 프로퍼티 바인딩과 (뷰에서 컴포넌트로) 이벤트 바인딩 을 모두 정의하여, 양방향 바인딩을 제공하는 지름길입니다.
  +
           In Angular, **two-way binding** is denoted by `[()]`, descriptively referred to as a "banana in a box". This syntax is a shortcut for defining both property binding (from the component to the view)
           and event binding (from the view to the component), thereby providing two-way binding.
   
  +        ngModel의 양방향 바인딩에 대한 자세한 정보는, [템플릿 구문](../guide/template-syntax.html#ngModel)에서 확인하세요.
  +
           For more information on two-way binding with ngModel, see [Template Syntax](../guide/template-syntax.html#ngModel).
     tr(style=top)
       td
         :marked
           ### ng-repeat
  +        ### ng-repeat
         code-example(format="").
           &lt;tr ng-repeat="movie in vm.movies">
         :marked
  +        AngularJS에서, `ng-repeat` 지시자는 지정된 컬렉션의 각 항목에 대해 연관된 DOM 엘리먼트를 반복합니다.
  +
           In AngularJS, the `ng-repeat` directive repeats the associated DOM element
           for each item in the specified collection.
   
  +        이 예제에서 테이블 행 (`tr`) 엘리먼트는 movie 컬렉션의 각 movie 객체에 대해 반복됩니다.
  +
           In this example, the table row (`tr`) element repeats for each movie object in the collection of movies.
       td
         :marked
  +        ### *ngFor
           ### *ngFor
         +makeExample('cb-ajs-quick-reference/ts/src/app/movie-list.component.html', 'ngFor')(format="." )
         :marked
  
positive.code: include ../_util-fns
  a(id="top")
  :marked
    _Angular_ is the name for the Angular of today and tomorrow.
    _AngularJS_ is the name for all v1.x versions of Angular.
  
    This guide helps you transition from AngularJS to Angular
    by mapping AngularJS syntax to the equivalent Angular syntax.
  
  :marked
    **See the Angular syntax in this <live-example name="cb-ajs-quick-reference"></live-example>**.
  
    ## Contents
    This page covers:
    * [Template basics](#template-basics) - binding and local variables.
  
    * [Template directives](#template-directives) - built-in directives `ngIf` and `ngClass`.
  
    * [Filters/pipes](#filters-pipes) - built-in *filters*, known as *pipes* in Angular.
  
    * [Modules/controllers/components](#controllers-components) - *modules* in Angular are slightly different from *modules* in AngularJS, and *controllers* are *components* in Angular.
  
    * [Style sheets](#style-sheets) - more options for CSS than in AngularJS.
  
  .l-main-section
  :marked
    ## Template basics
    Templates are the user-facing part of an Angular application and are written in HTML.
    The following table lists some of the key AngularJS template features with their equivalent Angular template syntax.
  
  
negative.code:   tr(style=top)
      td
        :marked
          ### 바인딩/삽입식
          ### Bindings/interpolation
        code-example.
           Your favorite hero is: {{vm.favoriteHero}}
        :marked
          AngularJS에서 중괄호로 묶인 표현은 단방향 바인딩을 나타냅니다.
          이것은 엘리먼트의 값을 템플릿과 연관된 컨트롤러의 프로퍼티에 바인딩합니다.
  
          In AngularJS, an expression in curly braces denotes one-way binding.
          This binds the value of the element to a property in the controller
          associated with this template.
  
          `controller as`구문을 사용할 때,
          바인딩의 출처에 대해 특정해야하기 때문에 바인딩은 컨트롤러 별칭(`vm` 또는`$ctrl`)으로 시작됩니다.
  
          When using the `controller as` syntax,
          the binding is prefixed with the controller alias (`vm` or `$ctrl`) because you
          have to be specific about the source of the binding.
      td
        :marked
          ### 바인딩/삽입식
          ### Bindings/interpolation
        +makeExample('cb-ajs-quick-reference/ts/src/app/movie-list.component.html', 'interpolation')(format="." )
        :marked
          Angular에서 중괄호로 묶인 템플릿 표현식은 여전히 단방향 바인딩을 나타냅니다.
          이것은 엘리먼트의 값을 컴포넌트의 프로퍼티에 바인당합니다.
          바인딩 컨텍스트는 암시적이고 있고 항상 관련된 컴포넌트이므로, 참조 변수가 필요하지 않습니다.
  
          In Angular, a template expression in curly braces still denotes one-way binding.
          This binds the value of the element to a property of the component.
          The context of the binding is implied and is always the
          associated component, so it needs no reference variable.
  
          자세한 내용은, 템플릿 구문 페이지의 [삽입식](../guide/template-syntax.html#interpolation) 부분을 확인하세요.
  
          For more information, see the [Interpolation](../guide/template-syntax.html#interpolation) section of the Template Syntax page.
    tr(style=top)
      td
        :marked
          ### 필터
          ### Filters
        code-example.
           &lt;td>{{movie.title | uppercase}}&lt;/td>
        :marked
          AngularJS 템플릿의 출력을 필터링하려면, 파이프 문자 (|) 와 하나 이상의 필터를 사용하십시오.
  
          To filter output in AngularJS templates, use the pipe character (|) and one or more filters.
  
          이 예제는 `title` 프로퍼티를 대문자로 필터링합니다.
  
          This example filters the `title` property to uppercase.
      td
        :marked
          ### 파이프
          ### Pipes
        +makeExample('cb-ajs-quick-reference/ts/src/app/app.component.html', 'uppercase')(format="." )
        :marked
          Angular에서는 출력을 필터링하기 위해 파이프 (|) 문자와 유사한 구문을 사용하지만, 이제는 그것들을 **파이프**라고 부릅니다.
          AngularJS의 내장 필터 중 (전부는 아니지만) 대다수는 Angular의 내장 파이프입니다.
  
          In Angular you use similar syntax with the pipe (|) character to filter output, but now you call them **pipes**.
          Many (but not all) of the built-in filters from AngularJS are
          built-in pipes in Angular.
  
          자세한 내용은,아래의 [필터/파이프](#filters-pipes) 머릿말을 확인하세요.
  
          For more information, see the heading [Filters/pipes](#filters-pipes) below.
    tr(style=top)
      td
        :marked
          ### 지역 변수
          ### Local variables
        code-example(format="").
          &lt;tr ng-repeat="movie in vm.movies">
            &lt;td>{{movie.title}}&lt;/td>
          &lt;/tr>
        :marked
          여기, `movie`는 사용자가 정의한 지역변수입니다.
  
          Here, `movie` is a user-defined local variable.
      td
        :marked
          ### 입력 변수
          ### Input variables
        +makeExample('cb-ajs-quick-reference/ts/src/app/app.component.html', 'local')(format="." )
        :marked
          Angular는 `let` 키워드를 사용하여 명시적으로 정의된 실제 템플릿 입력 변수를 가지고 있습니다.
  
          Angular has true template input variables that are explicitly defined using the `let` keyword.
  
          자세한 내용은, 템플릿 구문 페이지의 [ngFor 세부구문](../guide/template-syntax.html#ngForMicrosyntax) 부분을 확인하세요.
  
          For more information, see the [ngFor micro-syntax](../guide/template-syntax.html#ngForMicrosyntax) section of the Template Syntax page.
  :marked
    [Back to top](#top)
  
  .l-main-section
  :marked
    ## 템플릿 지시자
    ## Template directives
  
    AngularJS는 템플릿에 대해 70개가 넘는 내장 지시자를 제공합니다.
    그것들 중 많은 것들은 보다 유능하고 표현력이 좋은 바인딩 시스템 때문에 Angular에서 필요하지 않습니다.
    다음은 AngularJS에 내장된 주요 지시자 중 일부와 그에 해당하는 Angular의 항목입니다.
  
    AngularJS provides more than seventy built-in directives for templates.
    Many of them aren't needed in Angular because of its more capable and expressive binding system.
    The following are some of the key AngularJS built-in directives and their equivalents in Angular.
  