Having Issues Rendering api data in Material Angular Table - html

Question

Good Afternoon,
I am trying to render the api data in a material table, but I am having issues connecting my NasaApiService to the dataSource array.
As of right now I am getting a "Type 'MatTableDataSource' is not assignable to type '[]'. error. Any help is much appreciated.
/*Nasa Service*/
import { Injectable } from '#angular/core';
import {HttpClient } from '#angular/common/http';
import {Observable} from 'rxjs';
import {map} from 'rxjs/operators';
export interface NasaStation {
name: string;
nametype: string;
id: string;
year: string;
recclass: string;
items: any;
}
#Injectable()
export class NasaApiService {
parsed: any;
constructor(private _http: HttpClient) {
}
getNasaData(): Observable<NasaStation> {
return this._http.get<NasaStation>('https://data.nasa.gov/resource/gh4g-9sfh.json');
}
}
/*nasa.component.*/
import { Component, OnInit } from '#angular/core';
import { NasaApiService} from '../nasa-api.service';
import {HttpClient} from '#angular/common/http';
import { MatTable,MatTableDataSource } from '#angular/material/table';
const api = 'https://data.nasa.gov/resource/gh4g-9sfh.json';
#Component({
selector: 'app-nasa',
templateUrl: './nasa.component.html',
styleUrls: ['./nasa.component.css']
})
export class NasaComponent implements OnInit {
data;
dataSource: [];
displayedColumns: string[] = ['Name', 'Name-type', 'ID', 'Year', 'Recclass'];
constructor(private _nasa: NasaApiService) {
}
ngOnInit(){
this._nasa.getNasaData().subscribe(data => {
this.dataSource = new MatTableDataSource(this.data);
this.data = data;
console.log(data);
})
}
}

Answer 1

ngOnInit(){
this._nasa.getNasaData().subscribe(data => {
this.data = data;
this.dataSource = this.data;
console.log(this.dataSource);
})
}
}
Was my final nasa.component code and I just passed datasource into Material Angular.