パネルのヘッダーに[追加]と[削除]ボタンを表示したいとします。以下のコードは、ファーアイコンとラベルなしのボタンを表示しますPrimeNGボタンにangular2のfaアイコンとラベルが表示されない
<p-panel>
<p-header>
<div>
Registration Form
<button type="button" pButton icon="fa-plus" style="float:right" label="Add">
</button>
</div>
</p-header>
</p-panel>
BrowserAnimationsModuleを読み込んだ後、パネル内にprimengボタンが表示されます。 ：あなたはangular2/4で作業している場合
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
サンプルコードに構造エラーがあります。私はあなたのためにplnkrを作成しました。
http://plnkr.co/edit/myrBq9tv4iNRNd6v6bhT?p=preview
<p-panel>
<p-header>
<div>Registration Form
<button type="button" pButton icon="fa-plus" style="float:right" label="Add"></button>
<button type="button" class="ui-button-danger" pButton icon="fa-minus" style="float:right" label="Delete"></button>
</div>
</p-header>
</p-panel>
私はそれを訂正しました。しかし、まだアイコンとラベルが表示されていません。 – Jan69
あなたのコードは罰金hereに取り組んでいます。
font-awesomeをアプリケーションにインポートしましたか？そうでない場合は、<head></head>タグのindex.htmlに追加してください。
<head>
...
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
</head>
また、ButtonModule, PanelModuleをアプリケーションにインポートする必要があります。
import {ButtonModule, PanelModule} from 'primeng';
@NgModule({
imports: [
...
ButtonModule,
PanelModule,
...
],
...
})
あなたapp.module.tsに[ラベルを示していないPrimengボタン]（HTTPSの
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
が重複する可能性を、次のインポートを追加する必要があります//stackoverflow.com/questions/45305915/primeng-button-not-showing-label） –
どのWebサーバーを使用していますか？ – BillF