Angular 9 проблема импорта DataTableResource - PullRequest
0 голосов
/ 04 мая 2020

Я попробовал Учебное пособие, чтобы получить базовые c знания о Angular. Я хочу заполнить таблицу данных данными, но получаю эту ошибку:

enter image description here

enter image description here

Вот мой код:

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 отсутствует элемент. Пожалуйста, помогите Я понятия не имею, что делать сейчас.

Заранее спасибо

Фло

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...