web-dev-qa-db-ja.com

Angular 8のPrimeNgテーブルについて

Angularアプリケーションでp-table(PrimeNgテーブル)を使用しようとしましたが、必要な依存関係をすべてインポートし、CLIからモジュールファイルにインポートしました。エラーは、

ターゲットエントリポイント "primeng/table"のエラーに依存関係がありません:-@ angular/cdk/scrolling

    import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';

import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { AccordionModule } from 'primeng/accordion'; //accordion and accordion tab
import { MenuItem } from 'primeng/api';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { TableModule } from 'primeng/table';

@NgModule({
  declarations: [AppComponent],
  imports: [BrowserModule, AppRoutingModule, AccordionModule,TableModule],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {}

私のcomponent.htmlは:

<h1>Hello {{ title }}</h1>
<br />

<p-table [value]="detail">
  <ng-template pTemplate="header">
    <tr>
      <th>Vin</th>
      <th>Year</th>
      <th>Brand</th>
      <th>Color</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-car>
    <tr>
      <td>Aashiq</td>
      <td>Aadhil</td>
      <td>Zubair</td>
      <td>Athaa</td>
    </tr>
  </ng-template>
</p-table>

私のapp.component.tsは:

import { Component,OnInit } from '@angular/core';


@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  ngOnInit(): void {

    throw new Error("Method not implemented.");
  }
  title = 'Angularprimeng';
    detail:any;

}


1
Aashiq ahmed

こんばんは!

素材CDKをインストールしてみましたか?

npm install @angular/cdk --save

これで問題が解決します。

よろしく、

ジョナサン

2
jboileau173

私は同じ問題に直面しました。 Angular CLIを使用したコマンドにより、依存パッケージの下に親切にインストールしてください。

npm install --save @ angular/material @ angular/cdk @ angular/animations

次に、コマンドng serveを使用してアプリケーションを再度起動します。

それは私のために働いた。

1
vishnu wagh

パッケージの依存関係の問題が解決されたことを嬉しく思います。

2番目の質問については、コードを考えると、テーブルに何もないことは完全に正常です。

HTMLファイルで宣言したpTemplate "body"は、 "detail"プロパティにある各要素の情報を構造化するために存在します。これは配列である必要があります。

PrimeNgのドキュメントを注意深く読んでエラーを修正してください。

https://primefaces.org/primeng/showcase/#/table

お役に立てば幸いです。素敵な夜をお過ごしください。また会いましょう!

0
jboileau173