update card | advanceddoc

primefaces · Dec 19, 2024 · a62859f · a62859f
1 parent d3d203d
commit a62859f
Showing 1 changed file with 12 additions and 12 deletions.
diff --git a/apps/showcase/doc/card/advanceddoc.ts b/apps/showcase/doc/card/advanceddoc.ts
@@ -10,16 +10,16 @@ import { Component } from '@angular/core';
         </app-docsectiontext>
         <div class="mb-4 p-8 flex items-center justify-center">
             <p-card [style]="{ width: '25rem', overflow: 'hidden' }">
-                <ng-template pTemplate="header">
+                <ng-template #header>
                     <img alt="Card" class="w-full" src="https://primefaces.org/cdn/primeng/images/card-ng.jpg" />
                 </ng-template>
-                <ng-template pTemplate="title"> Advanced Card </ng-template>
-                <ng-template pTemplate="subtitle"> Card subtitle </ng-template>
+                <ng-template #title> Advanced Card </ng-template>
+                <ng-template #subtitle> Card subtitle </ng-template>
                 <p>
                     Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore sed consequuntur error repudiandae numquam deserunt quisquam repellat libero asperiores earum nam nobis, culpa ratione quam perferendis esse, cupiditate neque
                     quas!
                 </p>
-                <ng-template pTemplate="footer">
+                <ng-template #footer>
                     <div class="flex gap-4 mt-1">
                         <p-button label="Cancel" severity="secondary" class="w-full" [outlined]="true" styleClass="w-full" />
                         <p-button label="Save" class="w-full" styleClass="w-full" />
@@ -33,16 +33,16 @@ import { Component } from '@angular/core';
 export class AdvancedDoc {
     code: Code = {
         basic: `<p-card [style]="{ width: '25rem', overflow: 'hidden' }">
-    <ng-template pTemplate="header">
+    <ng-template #header>
         <img alt="Card" class="w-full" src="https://primefaces.org/cdn/primeng/images/card-ng.jpg" />
     </ng-template>
-    <ng-template pTemplate="title"> Advanced Card </ng-template>
-    <ng-template pTemplate="subtitle"> Card subtitle </ng-template>
+    <ng-template #title> Advanced Card </ng-template>
+    <ng-template #subtitle> Card subtitle </ng-template>
     <p>
         Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore sed consequuntur error repudiandae numquam deserunt
         quisquam repellat libero asperiores earum nam nobis, culpa ratione quam perferendis esse, cupiditate neque quas!
     </p>
-    <ng-template pTemplate="footer">
+    <ng-template #footer>
         <div class="flex gap-4 mt-1">
             <p-button label="Cancel" severity="secondary" class="w-full" [outlined]="true" styleClass="w-full" />
             <p-button label="Save" class="w-full" styleClass="w-full" />
@@ -52,16 +52,16 @@ export class AdvancedDoc {
 
         html: `<div class="mb-4 p-8 flex items-center justify-center">
     <p-card [style]="{ width: '25rem', overflow: 'hidden' }">
-        <ng-template pTemplate="header">
+        <ng-template #header>
             <img alt="Card" class="w-full" src="https://primefaces.org/cdn/primeng/images/card-ng.jpg" />
         </ng-template>
-        <ng-template pTemplate="title"> Advanced Card </ng-template>
-        <ng-template pTemplate="subtitle"> Card subtitle </ng-template>
+        <ng-template #title> Advanced Card </ng-template>
+        <ng-template #subtitle> Card subtitle </ng-template>
         <p>
             Lorem ipsum dolor sit amet, consectetur adipisicing elit. Inventore sed consequuntur error repudiandae numquam deserunt
             quisquam repellat libero asperiores earum nam nobis, culpa ratione quam perferendis esse, cupiditate neque quas!
         </p>
-        <ng-template pTemplate="footer">
+        <ng-template #footer>
             <div class="flex gap-4 mt-1">
                 <p-button label="Cancel" severity="secondary" class="w-full" [outlined]="true" styleClass="w-full" />
                 <p-button label="Save" class="w-full" styleClass="w-full" />