title: Ionic Active Segment Not Highlighted when Multiple ngFor
body: <p>I have a problem in using Ionic segments. I use dynamic values (ngFor) for the segment and its contents. The problem is, the selected active segment is not highlighted.</p>
  
  <p>I have a simple array like this in my component, order-menu.ts:</p>
  
  <pre><code>public myCategories = 
    [{
      catName: "Chicken",
    }, 
    {
      catName: "Beef",
    }];
  
  public mySelCategory: string = "Chicken";
  </code></pre>
  
  <p>I want to display this segments in ionic app.</p>
  
  <p>This is my template, order-menu.html:</p>
  
  <pre><code>&lt;ion-segment [(ngModel)]="mySelCategory"&gt;
      &lt;ion-segment-button *ngFor="let category of myCategories" value="{{category.catName}}"&gt;
          {{category.catName}}
      &lt;/ion-segment-button&gt;
  &lt;/ion-segment&gt;
  
  &lt;div [ngSwitch]="mySelCategory"&gt;
      &lt;div *ngFor="let category of myCategories"&gt;
          &lt;ion-list *ngSwitchCase="category.catName"&gt;
              &lt;ion-item&gt;
                  {{category.catName}}
              &lt;/ion-item&gt;
          &lt;/ion-list&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I am able to show the data correctly using segment, however it <strong>does not highlight the active segment.</strong></p>
  
  <p><a href="https://i.stack.imgur.com/gyZJr.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/gyZJr.png" alt="Active Segment not highlighted"></a></p>
  
  <p>I noticed that if I do not include this:</p>
  
  <pre><code>&lt;div [ngSwitch]="mySelCategory"&gt;
      &lt;div *ngFor="let category of myCategories"&gt;
          &lt;ion-list *ngSwitchCase="category.catName"&gt;
              &lt;ion-item&gt;
                  {{category.catName}}
              &lt;/ion-item&gt;
          &lt;/ion-list&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>, the active segment is shown correctly.</p>
  
  <p><a href="https://i.stack.imgur.com/So1U0.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/So1U0.png" alt="Active segment ok if no multiple ngFor"></a></p>
  
  <p>Can anybody help to troubleshoot this? Or any workaround? Thank you very much.</p>