title: Angular 4 ng-container vs *ngIf else
body: <p>I have a big table with many cols, and buttons to change edit mode, 
  for example:</p>
  
  <pre><code>&lt;td&gt;{{item.name}}&lt;/td&gt;
  &lt;td&gt;{{item.price}}&lt;/td&gt;
  &lt;td&gt;{{item.bonusPrice}}&lt;/td&gt;
  &lt;td&gt;{{item.kcal}}&lt;/td&gt;
  &lt;td&gt;{{item.weight}}&lt;/td&gt;
  &lt;td&gt;{{item.type}}&lt;/td&gt;
  &lt;td&gt;{{item.status}}&lt;/td&gt;
  ...
  </code></pre>
  
  <p>Which variant will be better, create 2 <code>ng-container</code>s </p>
  
  <pre><code>&lt;ng-container *ngIf="!item.isEdited"&gt;
    &lt;td&gt;{{item.name}}&lt;/td&gt;
    &lt;td&gt;{{item.price}}&lt;/td&gt;
    &lt;td&gt;{{item.bonusPrice}}&lt;/td&gt;
    &lt;td&gt;{{item.kcal}}&lt;/td&gt;
    &lt;td&gt;{{item.weight}}&lt;/td&gt;
    &lt;td&gt;{{item.type}}&lt;/td&gt;
    &lt;td&gt;{{item.status}}&lt;/td&gt;
  &lt;/ng-container&gt;
  
  and 
  
  &lt;ng-container *ngIf="item.isEdited"&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.name"&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.price"&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.bonusPrice"&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.kcal"&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.weight"&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.type"&gt;&lt;/td&gt;
    &lt;td&gt;&lt;input [(ngModel)]="item.status"&gt;&lt;/td&gt;
  &lt;/ng-container&gt;
  </code></pre>
  
  <p>or just used <code>*ngIf else</code> in each <code>&lt;td&gt;</code>:</p>
  
  <pre><code>&lt;td&gt;
    &lt;span *ngIf="!item.isEdited; else elseBlock"&gt;
        {{item.name}}
    &lt;/span&gt;
    &lt;ng-template #elseBlock&gt;
      &lt;input [(ngModel)]="item.name"&gt;
    &lt;/ng-template&gt;
  &lt;/td&gt;
  </code></pre>
  
  <p>which variant better in performance way and any other :)
  or maybe there is more better approach?</p>