Добавлено событие таблицы матов в строке - PullRequest
0 голосов
/ 07 февраля 2020

Я хочу выполнить действие, когда новая строка добавлена ​​в таблицу mat, но я не могу знать, когда это произойдет. Есть какой-нибудь излучатель или другой способ? Я прочитал всю мат-таблицу до c и поиска по Inte rnet, и я ничего не нашел.

Я хочу это:

<tr mat-row *matRowDef="let row; columns: columns;" onAdd=(function())>

Чтобы обновить источник данных, я просто добавил: this.datasource.data = newData

1 Ответ

0 голосов
/ 13 февраля 2020

Можете ли вы сделать что-то вроде следующего (я использовал существующую модель, которая была в моем коде "CaseDetailModel", поскольку вы не предоставили никакой информации о ваших типах данных):

import { Component, OnInit } from '@angular/core';
import { HttpClient } from '@angular/common/http';
import { CaseDetailModel } from '../../models/casedetailmodel';
import { MatTableDataSource } from '@angular/material/table';

@Component({
  selector: 'app-stackoverflow',
  templateUrl: './stackoverflow.component.html',
  styleUrls: ['./stackoverflow.component.scss']
})

export class StackoverflowComponent implements OnInit {

  private currentCaseDetails: CaseDetailModel[] = [];
  private newCaseDetails: CaseDetailModel[] = [];

  public dataSource: MatTableDataSource<CaseDetailModel>;

  constructor(private http: HttpClient) {}

  ngOnInit(): void {
    this.http.get<CaseDetailModel[]>('/some/data/').subscribe((caseDetails: CaseDetailModel[]) => {

      //This if statement will stop the initial list items all being classed as new - you may want to remove it
      if (this.currentCaseDetails.length) {
        //Get any items that do not currently exist in the table
        this.newCaseDetails = caseDetails.filter(cd => {
          return !this.currentCaseDetails.some(ccd => ccd.caseId === cd.caseId);
        });
      }

      this.newCaseDetails.forEach(ncd => {
        //Do something with each new item
      });

      this.currentCaseDetails = caseDetails;

      this.dataSource = new MatTableDataSource(caseDetails);
    });
  }
}
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...