title: Argument Type Observable<User[]> is not assignable to parameter of type User[]
body: <p>I'm trying to adapt the <a href="https://material.angular.io/components/table/overview" rel="noreferrer">material</a> examples like the following:</p>
  
  <pre class="lang-js prettyprint-override"><code>import { Component } from '@angular/core';
  import { MatTableDataSource } from '@angular/material';
  import { User } from '../models/user.model';
  import { XService } from './x.service';
  
  @Component({
    selector: 'x-component',
    styleUrls: ['x.component.css'],
    templateUrl: 'x.component.html',
  })
  
  export class XComponent {
  
    constructor(private xService: XService) {
    }
  
    displayedColumns = ['c1', 'c2', 'c3', 'c4'];
    dataSource = new MatTableDataSource&lt;User&gt;(this.xService.getUsers());
  
    applyFilter(filterValue: string) {
      filterValue = filterValue.trim(); // Remove whitespace
      filterValue = filterValue.toLowerCase(); // MatTableDataSource defaults to lowercase matches
      this.dataSource.filter = filterValue;
    }
  
  }
  </code></pre>
  
  <p>The getUsers() looks like this:</p>
  
  <pre class="lang-js prettyprint-override"><code>import { Injectable } from '@angular/core';
  import { HttpClient, HttpHeaders } from '@angular/common/http';
  
  import { User } from '../models/user.model';
  
  @Injectable()
  export class XService {
  
    constructor(private http:HttpClient) {}
  
    private userUrl = 'http://localhost:8080/X';
  
    public getUsers() {
      return this.http.get&lt;User[]&gt;(this.userUrl);
    }
  
  }
  </code></pre>
  
  <p>The user model looks like this:</p>
  
  <pre class="lang-js prettyprint-override"><code>export class User {
  
    c1 : string;
    c2 : string;
    c3 : string;
    c4 : string;
  }
  </code></pre>
  
  <p>The above REST API <code>localhost:8080/X</code> will result in something like this:</p>
  
  <pre><code>[ {
    "c1" : 1,
    "c2" : "I",
    "c3" : 244.0,
    "c4" : 0.0,
  }, {
   ...
  }
  ]
  </code></pre>
  
  <p>but unfortunately if I try to build it via:</p>
  
  <pre><code>ng build
  </code></pre>
  
  <p>I get the following:</p>
  
  <pre><code>Your global Angular CLI version (1.7.1) is greater than your local
  version (1.6.3). The local Angular CLI version is used.
  
  To disable this warning use "ng set --global warnings.versionMismatch=false".
  Date: 2018-02-26T11:03:55.196Z                                                       
  Hash: 7f10a43625c2473d5bc9
  Time: 4417ms
  chunk {inline} inline.bundle.js, inline.bundle.js.map (inline) 5.83 kB [entry] [rendered]
  chunk {main} main.bundle.js, main.bundle.js.map (main) 303 bytes [initial] [rendered]
  chunk {polyfills} polyfills.bundle.js, polyfills.bundle.js.map (polyfills) 323 bytes [initial] [rendered]
  chunk {scripts} scripts.bundle.js, scripts.bundle.js.map (scripts) 69.8 kB [initial] [rendered]
  chunk {styles} styles.bundle.js, styles.bundle.js.map (styles) 163 kB [initial] [rendered]
  
  ERROR in src/app/x/x.component.ts(21,45): error TS2345: 
  Argument of type 'Observable&lt;User[]&gt;' is not assignable 
  to parameter of type 'User[]'.
  Property 'includes' is missing in type 'Observable&lt;User[]&gt;'.
  </code></pre>
  
  <p>Based on the examples I would say it should be working but obviously it does not. The question is: Can someone give a hint/tip where to search or what the problem might be?</p>
  
  <p><strong>Update:</strong></p>
  
  <p>After changing the getUsers() into this (By suggestion of axl-code) </p>
  
  <pre class="lang-js prettyprint-override"><code>public getUsers() {
      return this.http.get&lt;User[]&gt;(this.userUrl).subscribe((data: any) =&gt; {
         return data;
      });
   }
  </code></pre>
  
  <p>I got the following error message during <code>ng build</code>:</p>
  
  <pre><code>ERROR in src/app/x/x.component.ts(21,45): error TS2345: 
  Argument of type 'Subscription' is not assignable to 
  parameter of type 'User[]'.
  Property 'includes' is missing in type 'Subscription'.
  </code></pre>