关于angular:模块’AppModule’导入的意外值’MatTableDataSource’。 请添加@NgModule批注

Unexpected value 'MatTableDataSource' imported by the module 'AppModule'. Please add a @NgModule annotation

我正在开发一个使用角度5的角度应用程序。我想使用角度材料中的" MatTableDataSource"。 但是我收到这个错误

模块" AppModule"导入的异常值" MatTableDataSource"。 请添加一个@NgModule批注。

我正在寻找解决此问题的方法。 我在git中找到了这个解决方案

" https://github.com/angular/material/issues/10981"

那里有一个名为@dliebel的用户提供了解决方案。 我应用了它,但是一次又一次地收到此错误。 app.module.ts在下面指定

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { ReactiveFormsModule, FormsModule, FormArray } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { SellDetailFormComponent } from './sellDetail/sellDetailForm.component';
import { RouterModule, Routes } from '@angular/router';
import { HotTableModule } from '@handsontable/angular';
import { CommonModule } from '@angular/common';
import { MatTableModule, MatSortModule,MatTableDataSource } from '@angular/material';
import { SellTableComponent } from './sellDetail/sellTable.component';


const appRoutes: Routes = [
{ path: 'sellTable', component: SellTableComponent }


];

@NgModule({
declarations: [
  AppComponent,SellTableComponent
 ],
imports: [
BrowserModule, HttpModule, FormsModule,
RouterModule.forRoot(appRoutes), ReactiveFormsModule,HotTableModule.forRoot() ,
 HttpClientModule, HotTableModule,
CommonModule,MatTableModule,MatSortModule,MatTableDataSource
],
bootstrap: [AppComponent]
})
export class AppModule { }


您不应将其导入到app模块中,而应直接在component.ts文件中导入并使用它

如果那不能解决问题

可能是我遇到的版本兼容性问题
我很可能需要将" @ angular / material"和" @ angular / cdk"更新为" 5.0.0-rc.2",这解决了我的问题

只是看看哪个版本与您的需求和使用兼容


MatDataTableSource不是角度模块。 从导入中删除它。 您只需按照角度材质添加您自己的零部件即可。

1
import {MatTableDataSource} from '@angular/material';

尝试正确导入模块。

1
2
3
4
5
6
7
8
9
import { MatFormFieldModule, MatInputModule, MatPaginatorModule, MatTableModule, MatSortModule } from '@angular/material';

imports: [
    MatFormFieldModule,
    MatInputModule,
    MatPaginatorModule,
    MatTableModule,
    MatSortModule
  ]

对我来说很好。


将其导入模块后,它对我有用