如何创建表格并在Angular中搜索该表格？

我有一个问题，一个很长的问题

有人可以帮助我，或者告诉我如何创建一个角度表，其中包含从API获取数据所需的数据。我实际上正在创建图书馆管理项目，其主要功能是从图书馆预订书籍。我正在实现的页面是搜索页面，应该允许用户搜索书籍，并且数据应该在一个表中显示给他，在顶部有一个搜索栏，在搜索栏旁边有一个搜索按钮。图书需要由作者在输入三个字母后进行搜索，并且表格中的图书应该在用户输入时进行过滤和显示。我知道我需要我已经创建的服务。我知道我需要两个独立的组件，一个用于搜索，这样我可以在以后使用它搜索用户，另一个用于tablegrid或其他任何东西。现在我的问题是，在组件中我需要什么？如何获取数据并将其显示在表格中？以及如何搜索和应用过滤器

这是我迄今为止创造的：

search-books.service.ts

import { Injectable } from '@angular/core';
import { Http } from '@angular/http';
import { Observable } from 'rxjs/Observable';
import { environment } from '../environment';
import { Book } from '../model/book';


@Injectable()

export class SearchBooksService {

    public url = environment.serverUrl + '/api/books';

    constructor(private http: Http) { }

    getBooks(): Observable<any> {
        return this.http.get(this.url);
    }
}   

到目前为止，我把search-books.component.html作为空html

---

当被测试的组件工作正常时，我在console.logthis.books中获得了所需的所有数据。如何继续以及如何创建这些组件以及搜索和表格。请帮忙，并提前向大家表示感谢

在angular中实现这一点的最佳方法是使用datatable扩展，数据将通过http调用从后端进行私有化。此外，搜索、排序选项将已经存在，您所要做的就是安装并提供该表的数据 下面是数据表示例的链接：

---

我真的希望我帮助了你，否则我会在这里，以防你需要更多的支持。

非常感谢你，我已经看到了这一点，但它不适用于我的项目。也许是另一个想法？它应该可以工作，但你需要安装角材料，请尝试以下方法：

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';

import { SearchBooksService } from '../service/search-books.service';
import { Book } from '../model/book';

@Component({
    templateUrl: './app/search-books/search-books.component.html'
})

export class SearchBooksComponent implements OnInit {

    books: Book[] = [];
    loading = false;

    constructor(
        private router: Router,
        private service: SearchBooksService
    ) { }

    ngOnInit() {
        this.service.getBooks().subscribe(
            data => {
                this.books = data.json();
            },
            error => {
                console.error(error);
            },
            () =>
        {
            //on success
            console.log(this.books);
        }
        );
    }
}