我有一个ngFor在表中创建行,过滤和分页.
<tr *ngFor="#d of data.results | filter:filterText | pagination:resultsPerPage:currentPage">
Run Code Online (Sandbox Code Playgroud)
页面上还有另一个元素显示显示的记录数.这些元素最初绑定到data.Results的长度.
如何获取应用过滤器管道后显示的数据长度,以便我可以正确显示它.ngFor中提供的局部变量都没有考虑到这一点.
我需要在ngFor循环中创建唯一的锚点名称/组件,以将其与ComponentResolver.resolveComponent一起使用.
<div>
<table>
<tr *ng-for="#vIndex of vArr">
<td *ng-for="#hIndex of hArr">
<div #uniqueanchorname{{vIndex}}_{{hIndex}}></div>
</td>
</tr>
</table>
</div>
Run Code Online (Sandbox Code Playgroud)
生成的HTML应该看起来像这样:
<div>
<table>
<tr>
<td>
<div #uniqueanchorname0_0></div>
</td>
<td>
<div #uniqueanchorname0_1></div>
</td>
</tr>
<tr>
<td>
<div #uniqueanchorname1_0></div>
</td>
<td>
<div #uniqueanchorname1_1></div>
</td>
<td>
<div #uniqueanchorname1_2></div>
</td>
</tr>
</table>
</div>
Run Code Online (Sandbox Code Playgroud)
有了它,我可以使用DynamicComponentLoader,如:
loader.loadIntoLocation(responseDependentComponent, elementRef, 'uniqueAnchorName1_2');
Run Code Online (Sandbox Code Playgroud)
生成的HTML不会被替换,看起来像:
<div>
<table>
<tr>
<td>
<div #uniqueanchorname{{vIndex}}_{{hIndex}}></div>
</td>
<td>
<div #uniqueanchorname{{vIndex}}_{{hIndex}}></div>
</td>
</tr>
<tr>
<td>
<div #uniqueanchorname{{vIndex}}_{{hIndex}}></div>
</td>
<td>
<div #uniqueanchorname{{vIndex}}_{{hIndex}}></div>
</td>
<td>
<div #uniqueanchorname{{vIndex}}_{{hIndex}}></div>
</td>
</tr>
</table>
</div>
Run Code Online (Sandbox Code Playgroud)
如果无法创建唯一的锚名称.还有其他方法可以将组件加载到特定位置吗?