title: How to use enum in Angular 2 templates
body: <p>I am trying to use enum in angularjs 2 templates.
  Below is my code</p>
  
  <pre><code>@Component({
      selector: 'test',
      template: `
  &lt;ul class="nav navbar-nav"&gt;
      &lt;li class="{{activeSection == SectionType.Primary ? 'active': ''}}"&gt;&lt;a href="javscript:void(0);" (click)="setActiveSection(SectionType.Primary)"&gt;Primary Details&lt;/a&gt;&lt;/li&gt;
      &lt;li class="{{activeSection == SectionType.Aditional ? 'active': ''}}"&gt;&lt;a href="javscript:void(0);" (click)="setActiveSection(SectionType.Aditional)"&gt;Additional Details&lt;/a&gt;&lt;/li&gt;
      &lt;li class="{{activeSection == SectionType.Payment ? 'active': ''}}"&gt;&lt;a href="javscript:void(0);" (click)="setActiveSection(SectionType.Payment)"&gt;Payment Settings &lt;/a&gt;&lt;/li&gt;           
    &lt;/ul&gt;`
    })
    export class TestComponent{
    activeSection: SectionType = SectionType.Primary;
     setActiveSection(section: SectionType) {
          this.activeSection = section;
      }
  }
  </code></pre>
  
  <p>here is my enum:</p>
  
  <pre><code>enum SectionType {
      Primary,
      Aditional,
      Payment
  }
  </code></pre>
  
  <p>It is throwing EXCEPTION: TypeError: Cannot read property 'Primary' of undefined</p>