我使用angular 6通过使用Dialogs内联行操作来实现材料表中的编辑/添加/删除行，但我得到了错误数据源。当我按下更新按钮时，过滤器不是一个函数，我不知道这里有什么问题，我缺少了什么。
这是我的更新管理信息.组件.ts*
```import { Component, ViewChild, OnInit, ChangeDetectorRef } from '@angular/core';
import {MatTableDataSource, MatTable} from '@angular/material/table';
import {MatDialog, MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
import { UserService } from '../services/user.service';
import { User } from '../model/User.model'
import { DialogeditComponent } from '../dialogedit/dialogedit.component';
@Component({
selector: 'app-update-admin-info',
templateUrl: './update-admin-info.component.html',
styleUrls: ['./update-admin-info.component.css']
})
export class UpdateAdminInfoComponent implements OnInit {
displayedColumns: string[] = ['firstname', 'lastname', 'email','college','department','action'];
dataSource;
users: User[];
@ViewChild(MatTable,{static:true}) table: MatTable<any>;
applyFilter(filterValue: string) {
this.dataSource.filter = filterValue.trim().toLowerCase();
}
constructor(public dialog: MatDialog,private userservice:UserService,private cdr: ChangeDetectorRef) { }
ngOnInit() {
this.userservice.getAdmins()
.subscribe((users: User[]) => {
this.users = users;
this.dataSource = new MatTableDataSource(users);
});
}
editUser(action,obj)
{
obj.action = action;
const dialogRef = this.dialog.open(DialogeditComponent,{
width: '250px',
data:obj
});
dialogRef.afterClosed().subscribe(result => {
if(result.event == 'update')
{
this.updateRowData(result.data);
}
});
this.cdr.detectChanges();
}
updateRowData(row_obj){
this.dataSource = this.dataSource.filter((value,key)=>{
if(value._id == row_obj.id){
value.firstname = row_obj.firstname;
}
return true;
});
this.cdr.detectChanges();
this.table.renderRows();
}
}```
这是我的Dialogedit.component.ts
```import { Component, OnInit, Inject, ChangeDetectorRef } from '@angular/core';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { User } from '../model/User.model';
import { UserService } from '../services/user.service';
import { UpdateinfoService } from '../services/updateinfo.service';
import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';
import { FormGroup, Validators, FormControl, AbstractControl } from '@angular/forms';
@Component({
selector: 'app-dialogedit',
templateUrl: './dialogedit.component.html',
styleUrls: ['./dialogedit.component.css'],
providers: [UserService]
})
export class DialogeditComponent implements OnInit {
action:string;
local_data:any;
constructor(public dialogRef: MatDialogRef<DialogeditComponent>,
@Inject(MAT_DIALOG_DATA) public data: User, public http: HttpClient, public updateinfo: UpdateinfoService, public router: Router, private userservice:UserService,private cdr: ChangeDetectorRef) { console.log(data);
this.local_data = {...data};
this.action = this.local_data.action;}
ngOnInit() {
}
onNoClick(): void {
this.dialogRef.close({event:'Cancel'});
this.cdr.detectChanges();
}
onEdit() {
this.dialogRef.close({event:this.action,data:this.local_data});
this.userservice.selectedUser =this.local_data;
this.cdr.detectChanges();
}
}```
这是我的Dialogedit.component.html
```<h1 mat-dialog-title>Row Action :: <strong>{{action}}</strong></h1>
<div mat-dialog-content>
<mat-form-field *ngIf="action != 'Delete'; else elseTemplate">
<input matInput [(ngModel)]="local_data.firstname" placeholder="First Name">
</mat-form-field>
<mat-form-field>
<input matInput [(ngModel)]="local_data.lastname" placeholder="Last Name">
</mat-form-field>
</div>
<div mat-dialog-actions>
<button mat-button (click)="onNoClick()" mat-flat-button color="warn">Cancel</button>
<button mat-button (click) = "onEdit(local_data)" >{{action}}</button>
</div>```
我得到的错误在这里的这一行this.dataSource = this.dataSource.filter((value,key)=>{
我已经完成了MatTableDataSource的代码，它有返回对象数组的get data()。所以应该使用this.dataSource.data.filter而不是this.dataSource.filter。
根据你的第二个问题，
如果有人能帮助我如何使用matDialog 在表上实现内联编辑，我的数据仍然无法更新
这是一个新线程，请在SO上打开新问题。
这是.datasource.filter是数组吗？
你有this.datasource.filter，filter也是数组方法。。
我想你把它改名…
或者！！
this.data.source可能不是数组
console.log所有