用Clarity Datagrid替换具体的展开行详细信息

我使用了Clarity Datagrid，并试图使用这里提到的功能：https://vmware.github.io/clarity/documentation/datagrid/expandable-rows。我想使用clrDgReplace输入来替换具有该行时展开的行的细节，但我只想对这几行（不是所有行）执行此操作。我如何实现这种行为？用Clarity Datagrid替换具体的展开行详细信息

这里是我的DataGrid代码：

<clr-datagrid> 
    <clr-dg-column>User ID</clr-dg-column> 
    <clr-dg-column [clrDgField]="'name'">Name</clr-dg-column> 

    <clr-dg-row *clrDgItems="let user of users" [clrDgItem]="user"> 
    <clr-dg-cell>{{user.id}}</clr-dg-cell> 
    <clr-dg-cell>{{user.name}}</clr-dg-cell> 

    <!-- Example using a wrapper component --> 
    <!--<detail-wrapper *clrIfExpanded ngProjectAs="clr-dg-row-detail" class="datagrid-row-flex"></detail-wrapper>--> 

    <clr-dg-row-detail *clrIfExpanded [clrDgReplace]="true"> 
     Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in neque in ante placerat mattis id sed quam. Proin rhoncus lacus et tempor dignissim. Vivamus sem quam, pellentesque aliquet suscipit eget, pellentesque sed arcu. Vivamus in dui lectus. Suspendisse 
      cursus est ac nisl imperdiet viverra. Aenean sagittis nibh lacus, in eleifend urna ultrices et. Mauris porttitor nisi nec velit pharetra porttitor. Vestibulum vulputate sollicitudin dolor ut tincidunt. Phasellus vitae blandit felis. Nullam 
      posuere ipsum tincidunt velit pellentesque rhoncus. Morbi faucibus ut ipsum at malesuada. Nam vestibulum felis sit amet metus finibus hendrerit. Fusce faucibus odio eget ex vulputate rhoncus. Fusce nec aliquam leo, at suscipit diam. 
    </clr-dg-row-detail> 
    </clr-dg-row> 


    <clr-dg-footer>{{users.length}} users</clr-dg-footer> 
</clr-datagrid>

这里是Plnkr复制问题：https://plnkr.co/edit/SSHfKApni8pWwXDEhuas?p=preview

来源

2017-09-15 takeradi

您可以将替代属性添加到您的用户对象，并设置要与细节，以取代那些为真，其他为假。

注意在app.component.ts文件

<clr-dg-row-detail *clrIfExpanded [clrDgReplace]="user.replace"> 
     Lorem ipsum dolor sit amet, consectetur adipiscing elit ... 
</clr-dg-row-detail>

这里clr-dg-row-deatil组件上的user.replace PROPERT是如何做到这一点的工作示例一plunker。 https://plnkr.co/edit/r4Fr7NUWvqyubwLGbucJ?p=preview

来源

2017-09-15 23:09:04 hippeelee

用Clarity Datagrid替换具体的展开行详细信息

回答

相关问题