title: Type 'xx' is not assignable to type 'any[] | Iterable<any> | > (Iterable<any> & any[]) | (any[] & Iterable<any>)'
body: <p>I am getting the following error. I have been trying to resolve this issue for sometime now but with no luck. Can someone please help me out.</p>
  <blockquote>
  <p>Type 'Student' is not assignable to type 'any[] | Iterable |
  (Iterable &amp; any[]) | (any[] &amp; Iterable)'. Type 'Student' is
  not assignable to type 'any[] &amp; Iterable'. Type 'Student' is not
  assignable to type 'any[]'.</p>
  </blockquote>
  <p><a href="https://stackblitz.com/edit/angular-ivy-8qsyqg?file=src%2Fapp%2Fapp.component.ts" rel="nofollow noreferrer">The Code can be found here.</a></p>
  <p><strong>app.component.html</strong></p>
  <pre><code>&lt;div *ngFor=&quot;let stu of studentSelected; let i = index;&quot;&gt;
    &lt;tr&gt;
      &lt;td&gt;{{stu.f}} :&lt;/td&gt;
      &lt;ng-container *ngFor=&quot;let s of stu.ff&quot;&gt;
        &lt;td&gt;{{s.s_name}}&lt;/td&gt;
      &lt;/ng-container&gt;
    &lt;/tr&gt;
  &lt;/div&gt;
  </code></pre>
  <p><strong>app.component.ts</strong></p>
  <pre><code>import { Component, VERSION } from '@angular/core';
  import { Student } from './student.model';
  
  @Component({
    selector: 'my-app',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent {
    studentSelected: Student | any = {
      f: 'dfd',
      ff: [
        {
          s_name: 'nswq'
        }
      ]
    };
  }
  </code></pre>
  <p><strong>School.model.ts</strong></p>
  <pre><code>export class School {
    s_name: string;
  
    constructor(s_name: string = '') {
      this.s_name = s_name;
    }
  }
  </code></pre>
  <p><strong>student.model.ts</strong></p>
  <pre><code>import { School } from './School.model';
  
  export class Student {
    f: string;
    ff: School[];
  
    constructor(f: string = '', ff: [] = []) {
      this.f = f;
      this.ff = ff;
    }
  }
  </code></pre>