Угловой: Разбиение на страницы с загрузкой

#angular #bootstrap-4 #pagination

Вопрос:

Я пытаюсь добавить разбивку на страницы в свою таблицу, перейдя по этой ссылке:

https://ng-bootstrap.github.io/#/components/table/examples (под нумерацией страниц).

Проблема в том,что я получаю ошибку на карте(продукт, я)..; это ошибка:

  • Свойство «карта» не существует для типа «тип продукта».
  • Параметр «продукт» неявно имеет тип «любой».
  • Параметр «i» неявно имеет тип «любой».

Не будете ли вы так добры помочь мне? Спасибо вам всем.

 import { Product } from '../product';
import { Observable, Subject } from "rxjs";
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import {map} from 'rxjs/operators';

import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';

@Component({
  selector: 'app-product-list',
  templateUrl: './product-list.component.html',
  styleUrls: ['./product-list.component.css']
})
export class ProductListComponent implements OnInit {

  constructor(private productservice: ProductService, private fb: FormBuilder, private modalService: NgbModal) {} 

  productsArray: any[] = [];
  dtTrigger: Subject<any> = new Subject();

  products: Product[] = [];
  product: Product = new Product();
  productlist: any;
  page = 1;
  pageSize = 4;
  collectionSize = Product.length;


  ngOnInit() {
  this.productservice.getProductList().subscribe(data => {
      console.log(data)
      this.products = data;
      this.dtTrigger.next();
    })
    this.editProfileForm = this.fb.group({
      productcode: [''],
      name: ['']
     });

     this.refreshProduct();
  }

  refreshProduct() {
    this.products = Product
      .map((product: any, i: number) => ({id: i   1, ...product}))
      .slice((this.page - 1) * this.pageSize, (this.page - 1) * this.pageSize   this.pageSize);
  }
  .
  .
  } 

Ответ №1:

вы, вероятно, хотели сделать следующее:

   ngOnInit() {
      this.productservice.getProductList().subscribe(data => {
          this.products = data;
          this.dtTrigger.next();
          this.refreshProduct();
      })
      this.editProfileForm = this.fb.group({
          productcode: [''],
          name: ['']
      });
  }

  refreshProduct() {
      this.productsArray = this.products
          .map((product: any, i: number) => ({ id: i   1, ...product }))
          .slice((this.page - 1) * this.pageSize, (this.page - 1) * this.pageSize   this.pageSize);
  }