title: Dynamic <select><option> with conditional <optgroup> as ng-container not working
body: <p>I have created a small dropdown component which takes the following interface as <code>&lt;option&gt;</code>s:</p>
  
  <pre><code>interface DropdownSelectChoice {
      label: string;
      key: string;
  }
  </code></pre>
  
  <p>The component to accepts a one- or two-dimensional array of choices</p>
  
  <pre><code>@Input() choices: DropdownSelectChoice[] | DropdownSelectChoice[][];
  </code></pre>
  
  <p>and if a two-dimensional array of choices is passed, to create unlabelled <code>&lt;optgroup&gt;</code>s of each set of choices:</p>
  
  <pre><code>&lt;span [class.disabled]="disabled"&gt;
      &lt;select (ngModelChange)="choose($event)"
              [disabled]="disabled"
              [(ngModel)]="defaultChoice"&gt;
  
          &lt;ng-container *ngIf="choices[0].constructor === Array"&gt;
              &lt;optgroup *ngFor="let group of choices" [label]="null"&gt;
                  &lt;option *ngFor="let choice of group"
                          [value]="choice.key"&gt;
                      {{ choice.label }}
                  &lt;/option&gt;
              &lt;/optgroup&gt;
          &lt;/ng-container&gt;
  
          &lt;ng-container *ngIf="choices[0].constructor !== Array"&gt;
              &lt;option *ngFor="let choice of choices"
                      [value]="choice.key"&gt;
                  {{ choice.label }}
              &lt;/option&gt;
          &lt;/ng-container&gt;
  
      &lt;/select&gt;
  &lt;/span&gt;
  </code></pre>
  
  <p>If I pass it a one-dimensional array, it works as expected:</p>
  
  <pre><code>choices: DropdownSelectChoice[] = [
      {
          label: "One",
          key: "1"
      },
      {
          label: "Two",
          key: "2"
      }
  ];
  </code></pre>
  
  <p>If I pass it a two-dimensional array:</p>
  
  <pre><code>choicesGroup: DropdownSelectChoice[][] = [
      [
  
          {
              label: "One",
              key: "1"
          },
          {
              label: "Two",
              key: "2"
          }
      ],
      [
          {
              label: "Three",
              key: "3"
          },
          {
              label: "Four",
              key: "4"
          }
      ]
  ];
  </code></pre>
  
  <p>I get <code>choicesGroup.length</code> blank <code>&lt;option&gt;</code>s with no <code>&lt;optgroup&gt;</code>.</p>
  
  <p>Setting a break-point in the drop down component's initialiser, I confirm that <code>this.choices[0].constructor === Array</code> is <code>true</code> when passing <code>choicesGroup</code>, but the template seems always to be evaluating the <code>!== Array</code> template path.</p>
  
  <p>What silly thing have I omitted that I am not noticing?</p>