Я попробовал Учебное пособие, чтобы получить базовые c знания о Angular. Я хочу заполнить таблицу данных данными, но получаю эту ошибку:
Вот мой код:
Admin.products.components.ts:
import { DataTableResource } from 'angular-9-datatable';
import { map } from 'rxjs/operators';
import { ProductService } from './../../product.service';
import { Component, OnInit, OnDestroy } from '@angular/core';
import { Subscription } from 'rxjs';
import { Product } from 'src/app/models/product';
@Component({
selector: 'app-admin-products',
templateUrl: './admin-products.component.html',
styleUrls: ['./admin-products.component.css']
})
export class AdminProductsComponent implements OnInit, OnDestroy {
products: Product[];
filteredProducts: any[];
subscription: Subscription;
tableResource: DataTableResource<Product>;
items: Product[];
itemCount: number;
constructor (private productService: ProductService){
this.subscription = this.productService.getAll().subscribe(products=> {
this.filteredProducts = products;
this.initializeTable(this.products);
});
}
private initializeTable(products: Product[]){
this.tableResource = new DataTableResource(products);
this.tableResource.query({offset: 0 })
.then(items => this.items = items);
this.tableResource.count().then(count => this.itemCount = count);
}
filter(query:string){
this.filteredProducts = (query) ?
this.products.filter(p => p.title.toLowerCase().includes(query.toLowerCase())) :
this.products;
console.log("thats the query: " +query);
}
reloadItems(params){
if (this.tableResource) return;
this.tableResource.query(params)
.then(items => this.items = items);
}
ngOnDestroy(){
this.subscription.unsubscribe();
}
ngOnInit(): void {
}
}
И HTML Файл: admin.products.component. html:
<p>
<a routerLink="/admin/products/new" class="btn btn-primary">New Product</a>
</p>
<data-tabel
[items]="items"
[itemCount]="itemCount"
(reload)="reloadItems($event)"
>
<data-table-column
[property]="'title'"
[header]="'Title'"
[sortabel]="true"
[resizable]="true"
>
<ng-template #dataTableCell let-item="product">
{{product.price | currency: 'EUR' :true}}
</ng-template>
</data-table-column>
<data-table-column
[property]="'$key'"
>
<ng-template #dataTableCell let-item="product">
<a [routerLink]="['/admin/products/', p.$key]">Edit</a>
</ng-template>
</data-table-column>
</data-tabel>
По-моему, я все правильно импортировал, но, похоже, в модуле angular -9-datatable node_module отсутствует элемент. Пожалуйста, помогите Я понятия не имею, что делать сейчас.
Заранее спасибо
Фло