web-dev-qa-db-ja.com

モジュール「AppModule」によってインポートされた予期しない値「DataTablesModule」。 @NgModuleアノテーションを追加してください

私はAngularデータテーブルに不慣れで、リンクにある指示に従ってAngularデータテーブルを実装しようとしています https：// l-lin.github.io/angular-datatables/#/getting-started

Angular CLIを使用してアプリケーションを実行しようとすると、指示に従った後、モジュール 'AppModule'によってインポートされた予期しない値 'DataTablesModule'が発生します。@ NgModuleアノテーションを追加してください。

注：以下に示すように、app.module.tsにDataTablesModuleを追加しました

import { ActionComponent } from './action/action.component';
import { SearchfilterPipe } from './search/searchfilter.pipe';
import { DataTablesModule } from 'angular-datatables';

@NgModule({
declarations: [
AppComponent,
routingComponents,
LicenseComponent,
HeaderComponent,
ActionComponent,
FooterComponent,
SearchfilterPipe

],
imports: [
BrowserModule,
HttpModule,
FormsModule,
DataTablesModule,
AppRoutingModule,
NgbModule.forRoot()
],
providers: [HttpModule],
bootstrap: [AppComponent]
})
export class AppModule { }

.angular-cli.jsonに以下のコードを追加しました

{
"apps": [
{
  ...
  "styles": [
    "../node_modules/datatables.net-dt/css/jquery.dataTables.css"
  ],
  "scripts": [
    "../node_modules/jquery/dist/jquery.js",
    "../node_modules/datatables.net/js/jquery.dataTables.js"
  ],
  ...
 }
 ]
 }

以下のバージョンを使用しています。

@ angular/cli：1.1.0
ノード：8.0.0
@ angular /compiler：4.2.3
@ angular/core：4.2.6
@ angular /compiler-cli：4.2.3

私のアプリケーションがクラッシュしている理由が正確にわからない。どんな入力/提案も大歓迎です。

angulardatatables
7
praveen sangalad

最初にtsconfig.jsonを変更し、このブロックを内部に追加します

{
  "compilerOptions": {
    ...
    "baseUrl": "./",
    "paths": {
      "@angular/*": [
        "../node_modules/@angular/*"
     ]
    }
  }
}

次に、angular-datatablesは実際にnode_modulesのバージョンをインストールし、その中に@angularのコピーを含めます。これにより、angularバージョン間で競合が発生するため、削除するだけです。 node_modulesフォルダーのangular-datatablesで、準備は完了です。

7
Nour

あなたは進撃の巨人で走ることができます

ng serve --aot

または--preserve-linksオプションを使用します

ng serve --preserve-symlinks
0
antoine