基于此示例After Search
我正在尝试使代码适应api的响应。但是我得到
Type 'any[] | ConLiq' is not assignable to type '{}[]'.
Type 'ConLiq' is not assignable to type '{}[]'.
Property 'includes' is missing in type 'ConLiq'.
line: ).subscribe(data => this.dataSource.data = data);
为什么会这样,“包括”的属性是什么?我在数据源对象中看不到它。
错误专门在this.dataSource.data
JSON :
[
{
"con": "Sonsectetur sunt",
"con_id": 360,
},
{
"con": "Oulla dolore",
"con_id": 933,
}
]
TS :
export class LiqConComponent implements OnInit {
displayedColumns = ['con', 'con_id'];
exampleDatabase: ExampleHttpDao | null;
dataSource = new MatTableDataSource();
isLoadingResults = true;
@ViewChild(MatPaginator) paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
constructor(private http: HttpClient) { }
ngOnInit() {
this.exampleDatabase = new ExampleHttpDao(this.http);
// If the user changes the sort order, reset back to the first page.
this.sort.sortChange.subscribe(() => this.paginator.pageIndex = 0);
merge(this.sort.sortChange, this.paginator.page)
.pipe(
startWith([]),
switchMap(() => {
this.isLoadingResults = true;
return this.exampleDatabase!.getConLiq();
}),
map(data => {
// Flip flag to show that loading has finished.
this.isLoadingResults = false;
return data;
}),
catchError(() => {
this.isLoadingResults = false;
return observableOf([]);
})
).subscribe(data => this.dataSource.data = data); // Here I get the error
}
}
export interface ConLiq {
con: string;
con_id: number;
}
export class ExampleHttpDao {
constructor(private http: HttpClient) { }
getConLiq(): Observable<ConLiq> {
const json_con = api + 'conliq';
return this.http.get<ConLiq>(json_con);
}
}
getConLiq()返回:
{
"_isScalar": false,
"source": {
"_isScalar": false,
"source": {
"_isScalar": false,
"source": {
"_isScalar": true,
"value": {
"url": "api address",
"body": null,
"reportProgress": false,
"withCredentials": false,
"responseType": "json",
"method": "GET",
"headers": {
"normalizedNames": {},
"lazyUpdate": null,
"headers": {}
},
"params": {
"updates": null,
"cloneFrom": null,
"encoder": {},
"map": null
},
"urlWithParams": "api address"
}
},
"operator": {
"concurrent": 1
}
},
"operator": {}
},
"operator": {}
}
答案 0 :(得分:1)
您的代码中存在多个问题:
getConLiq()
函数返回Observable<ConLiq>
,但是它应该是Observable<ConLiq[]>
。 return this.http.get<ConLiq>(json_con);
也是一样,应该是return this.http.get<ConLiq[]>(json_con);
MatTableDataSource
是参数化类型,因此行dataSource = new MatTableDataSource();
应该为dataSource = new MatTableDataSource<ConLiq>();