title: Angular 2 and webpack: unexpected closing tag "a"
body: <p>I have this Angular 2 template which display tabs of my Web site:</p>
  
  <pre><code>&lt;div id="menu"&gt;
      &lt;ul id="tabs"&gt;
          &lt;li *ngFor="let tab of tabs; let i = index" [class.active]="selectedTab===i"&gt;
              &lt;a routerLink="/private/home/{{i}}"&gt;{{tab}}&lt;/a&gt;
          &lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  
  &lt;div class="tabContent"&gt;
      &lt;span *ngIf="selectedTab==0"&gt;&lt;welcome&gt;&lt;/welcome&gt;&lt;/span&gt;
      &lt;span *ngIf="selectedTab==1"&gt;&lt;boiler&gt;&lt;/boiler&gt;&lt;/span&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>It works perfectly well. Then, I try to use Webpack with default option to create unique *.js file: it still works.
  Finally, in Webpack, I active the option to minimize the .js file and I get this error:</p>
  
  <pre><code>Unexpected closing tag "a" (" of tabs; let i = index" [class.active]="selectedTab===i"&gt;
  &lt;a routerlink=/private/home/{{i}}&gt;{{tab}}[ERROR -&gt;]&lt;/a&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt;                 
  &lt;div class=tabContent&gt; &lt;span *ngif="selectedTab==0"&gt;&lt;welcome&gt;&lt;/welcome&gt;&lt;/span")
  </code></pre>
  
  <p>Any idea on this error ?</p>
  
  <p>Here the related code generated by Webpack:</p>
  
  <pre><code>function(t,e){t.exports='&lt;div id=menu&gt; &lt;ul id=tabs&gt; &lt;li *ngfor="let tab of tabs; 
  let i = index" [class.active]="selectedTab===i"&gt; 
  &lt;a routerlink=/private/home/{{i}}&gt;{{tab}}&lt;/a&gt; &lt;/li&gt; &lt;/ul&gt; &lt;/div&gt; &lt;div class=tabContent&gt; 
  &lt;span *ngif="selectedTab==0"&gt;&lt;welcome&gt;&lt;/welcome&gt;&lt;/span&gt; &lt;span *ngif="selectedTab==1"&gt;
  &lt;boiler&gt;&lt;/boiler&gt;&lt;/span&gt; &lt;/div&gt;'}
  </code></pre>