角度5：从另一个组件调用方法

Question

我想创建一个对话框确认，以删除一个包含2个组件的打字稿文件中的数据。下面是ConfirmDialog组件：

@Component({
  selector: 'confirm-dialog',
  templateUrl: 'confirm-dialog.html',
})
export class ConfirmDialog {
  constructor(
    public dialogRef: MatDialogRef<ConfirmDialog>,
  )
  {
  }
  confirmClick(): void {
    //Delete Method from Another Component Here
    console.log("Confirm Delete");    
    this.dialogRef.close();
  }
  cancelClick(): void {
    console.log("Cancel Delete");
    this.dialogRef.close();
  }
}

然后，我想连接以将ConfirmDialog组件中的ConfirmClick与Index-Company-Component中的deleteCompany（company）连接起来。 这是IndexCompany组件：

import { Component, OnInit, ViewChild, Inject } from '@angular/core';
import { MatTableDataSource, MatPaginator, MatSort } from '@angular/material';
import { CompanyService } from '../../../services/company.service';
import { AuthService } from '../../../services/auth.service';
import { Company } from '../../../models/company.model';
import { Router } from '@angular/router';
import { MatDialog, MatDialogRef} from '@angular/material';

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

export class IndexCompanyComponent implements OnInit {
  company   : Object;
  companies : Object;
  displayedColumns = ['perusahaan', 'kategori', 'mahasiswa', 'option'];
  dataSource: MatTableDataSource<Company>;

  applyFilter(filterValue: string) {
    filterValue = filterValue.trim(); 
    filterValue = filterValue.toLowerCase();
    this.dataSource.filter = filterValue; 
  }
  constructor(
    private router: Router,
    private authService: AuthService,
    private companyService: CompanyService,
    public dialog: MatDialog,
  )
  {
    let user = localStorage.getItem('user');
    let token = localStorage.getItem('id_token');
    let level = Number(localStorage.getItem('level'));
    if (!this.authService.loggedIn(user, token, level)) {
      this.router.navigate(['/']);
      console.log('Please login first.');
    }
    this.companyService.getCompanies().subscribe(companies => {
      this.companies = companies;
      this.dataSource = new MatTableDataSource(companies);
    },
    err => {
      console.log(err);
      return false;
    });
  }
  ngOnInit(){
  }

  openDialog(): void {
    const dialogRef = this.dialog.open(ConfirmDialog, {
      width: '500px'
    });
    dialogRef.afterClosed().subscribe(result => {
      console.log('The dialog was closed');
    });
  }

  viewCompany(companies){
    this.router.navigate(['companies/'+companies._id]);
  }
  addCompany(event:any){
    event.preventDefault();
    this.companyService.setter(new Company());
    this.router.navigate(['company/addCompany']);
  }
  updateCompany(companies){
    this.companyService.setter(companies);
    this.router.navigate(['company/updateCompany/'+companies._id]);
  }
  deleteCompany(company){
    var _id = company._id;
    this.companyService.deleteCompany(_id).subscribe(
      _id => {
        console.log("Delete Success.");
        window.location.reload();
      },
      err => {
        console.log(err);
      }
    );
  }
}