Получение ошибок таблицы данных при попытке создания углового приложения в производстве

Question

Всякий раз, когда я делаю ng build --prod на терминале, я получаю следующие ошибки. Я немного читал, и там говорится, что мне нужно изменить ключевое слово private на public в моем конструкторе, но я пробовал это, и это не сработало.

ERROR in node_modules/angular5-data-table/angular5-data-table.d.ts.DataTable.html(52,19): : Property 'resizeColumnStart' is private and only accessible within class 'DataTableComponehin class 'DataTableComponent'. node_modules/angular5-data-table/angular5-data-table.d.ts.DataTable.html(66,19): : Property 'resizeColumnStart' is private and only accessible within class 'DataTableComponent'. 'DataTableComponent'. node_modules/angular5-data-table/angular5-data-table.d.ts.DataTable.html(35,71): : Expected 2 arguments, but got 1.

Ниже я использую таблицу данных в своем HTML-файле. Я попытался удалить [resizeable], чтобы попытаться исправить последнюю ошибку, но это не сработало.

    <p>
    <a routerLink="/admin/products/new" class="btn btn-primary">New Product</a>
</p>
<p>
    <input #query (keyup)="filter(query.value)" type="text" class="form-control" placeholder="Search...">
</p>

<data-table [items]="items" [itemCount]="itemCount" (reload)="reloadItems($event)">
    <data-table-column [property]="'title'" [header]="'Title'" [sortable]="true" [resizable]="true"> </data-table-column>
    <data-table-column [property]="'price'" [header]="'Price'" [sortable]="true" [resizable]="true">
        <ng-template #dataTableCell let-item="item">
            {{ item.price | currency:'USD':true }}
        </ng-template>
    </data-table-column>
    <data-table-column [property]="'key'">
        <ng-template #dataTableCell let-item="item">
            <a [routerLink]="['/admin/products/', item.key]">Edit</a>
        </ng-template>
    </data-table-column>
</data-table>

Компонент, в котором я пытался сделать productService общедоступным из частного из прочитанного мной чтения,но это не сработало:

import { Product } from 'shared/models/product';
import { ProductService } from 'shared/services/product.service';
import { Component, OnInit, OnDestroy } from '@angular/core';
import { AngularFireList } from '@angular/fire/database';
import { map } from 'rxjs/operators';
import { Subscription } from 'rxjs';
import { DataTableResource } from 'angular5-data-table';

@Component({
  selector: 'app-admin-products',
  templateUrl: './admin-products.component.html',
  styleUrls: ['./admin-products.component.css']
})
export class AdminProductsComponent implements OnInit, OnDestroy {
  products: Product[];
  subscription: Subscription;
  tableResource: DataTableResource<Product>;
  items: Product[] = [];
  itemCount: number; 

  constructor(private productService: ProductService) { 
    this.subscription = this.productService.getAll()
      .subscribe((products: any[] )=> {
        this.products = products;
        this.initializeTable(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);
  }

  reloadItems(params) {
    if(!this.tableResource) return;
    this.tableResource.query({ params })
      .then(items => this.items = items);
  }

  filter(query: string) {
    let filteredProducts = (query) ?
      this.products.filter(p => p.title.toLowerCase().includes(query.toLowerCase())) : 
      this.products;

    this.initializeTable(filteredProducts);
  }

  ngOnInit() {
  }

  ngOnDestroy() {
    this.subscription.unsubscribe();
  }
}

Answer 1

Вы должны избегать AOT. Так что пишите

ng b --prod --aot=false --build-optimizer=false

Я думаю, что это будет работать.