如何发送到模态窗口对象?

时间:2019-07-01 00:30:42

标签: angular typescript

我与用户一起使用表格,我希望在用户附近创建按钮,例如EDIT,并且在获得模态窗口后,但没有单击该对象。我尝试使 函数打开,我将参数USer发送到模态窗口。

我用ModalDirective来填充模态窗口。

import { Component, ViewChild } from '@angular/core';
import {MatPaginator, MatSort, MatTableDataSource} from '@angular/material';
import { UserService } from '../tables/user-table/user.service';

import { ModalDirective } from 'angular-bootstrap-md'
import { MatDialog, MatDialogRef } from  '@angular/material';
@Component({
  selector: 'app-table-overview-example',
  templateUrl: './table-overview-example.component.html',
  styleUrls: ['./table-overview-example.component.scss']
})

export class TableOverviewExampleComponent {

  displayedColumns = ['index', 'email', 'phone', 'role', 'edit'];

  dataSource: MatTableDataSource<UserData>;

  @ViewChild(MatPaginator) paginator: MatPaginator;
  @ViewChild(MatSort) sort: MatSort;
  @ViewChild('basicModal') basicModal: ModalDirective;
  constructor(private userService: UserService) { 
  }

  ngAfterViewInit() {
      this.userService.getUsers().subscribe((res : UserData[]) => {
        this.dataSource = new MatTableDataSource(res);
        this.dataSource.paginator = this.paginator;
        this.dataSource.sort = this.sort;
    });
  }

  applyFilter(filterValue: string) {
    filterValue = filterValue.trim();
    filterValue = filterValue.toLowerCase();
    this.dataSource.filter = filterValue;
  }

  exampleFunc(user: UserData) {
    console.log(user);
  }


  open(user: UserData) {
    console.log(user);

    this.basicModal.show();
  }
}

export interface UserData {
  email: string;
  phone: string;
  role: string;
}

0 个答案:

没有答案