CODEWITHSUNDEEP
angularvmware-clarity
FlashBanistan
FlashBanistan

Reputation: 456

Clarity datagrid how to replace a row when using ngProjectAs?

In order to replace a row when it is expanded the documentations looks like this:

<clr-dg-row *ngFor="let user of users">
    <-- Cells declarations -->
    <clr-dg-cell>...</clr-dg-cell>

    <clr-dg-row-detail *clrIfExpanded [clrDgReplace]="true">
        Lorem ipsum...
    </clr-dg-row-detail>
</clr-dg-row>

This works but I also want to replace <clr-dg-row-detail> with my own component so I can lazy load the details. The documentation for that looks like this:

<clr-dg-row *ngFor="let user of users">
    <-- Cells declarations -->
    <clr-dg-cell>...</clr-dg-cell>

    <my-detail *clrIfExpanded [user]="user" ngProjectAs="clr-dg-row-detail"></my-detail>
</clr-dg-row>

I tried placing [clrDgReplace]="true" on my custom component and inside of ngProjectAs but it throws errors. Any help would be appreciated.

Upvotes: 1

Views: 231

Answers (1)

Eudes
Eudes

Reputation: 1661

[clrDgReplace]="true" needs to be on the <clr-dg-row-detail> element itself, it's an input of the row detail component. So in your case, the <clr-dg-row-detail [clrDgReplace]="true"> is inside the template of your custom component.

Upvotes: 2

Related Questions