79541294

Date: 2025-03-28 11:30:31
Score: 0.5
Natty:
Report link

You will have to set "standalone: true" inside the @Component decorator. It should look something like this.

@Component({
  selector: 'app-table',
  standalone: true, // add this
  imports: [Skeleton, TableModule, NgTemplateOutlet],
  template: `
    <p-table>
      <ng-template let-row let-rowIndex="rowIndex" pTemplate="body">
       <ng-container
          [ngTemplateOutlet]="bodyCtx()"
          [ngTemplateOutletContext]="{ $implicit: row, rowIndex }"
        />
      </ng-template>
    </p-table>

  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TableComponent<T> {
  public readonly bodyCtx = contentChild.required<TemplateRef<unknown>>('body');
}
@Component({
  selector: 'app-dashboard',
  standalone: true, // add this
  imports: [
    TableComponent,
  ],
  template: `
    <app-table>
      <ng-template #body let-row let-rowIndex="rowIndex">
        <tr>
          <td>{{ row.name || '-' }}</td>
        </tr>
      </ng-template>
    </app-table>
  `,
  changeDetection: ChangeDetectionStrategy.OnPush,
})
export class DashboardComponent {}
Reasons:
  • Long answer (-1):
  • Has code block (-0.5):
  • User mentioned (1): @Component
  • Low reputation (1):
Posted by: a m a n