Angularjs   发布时间:2022-04-20  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了Ng-repeat-start in angular2 – aka使用NgFor重复多个元素大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要在Angular2的每个项目的列表中重复几个li元素。在角度1.x中,我使用了ng-repeat-start和ng-repeat-end。我在Angular 2中找不到正确的方法。有 some older blog posts关于这个,但他们的建议不适用于Angular2的最新beta。

应该为每个类别重复所有< li>元素:
(我通常会使用属性* ngFor =“#类别” – 但我找不到放在哪里…

帮帮我?

<ul class="dropdown-menu" role="menu">
    <li class="dropdown-header">
        {{ category.title }}
    </li>
    <li>
        <a href="{{ '/music/' + tag.keyword }}" *ngFor="#tag of category.tags" [hidden]="tag.deleted === 1">{{ tag.tag_title_da }}</a>
    </li>
    <li class="divider"></li>

    <li class="dropdown-header">Alle musikstykker</li>
    <li><a href="/music/all">Alle musikstykker</a></li>
</ul>
如果要重复内容,请使用模板标签,并在ngFor上删除*前缀。

根据Victor Savkin on ngFor和模板:

<ul class="dropdown-menu" role="menu">
   <template ngFor #category [ngForOf]="categories">
    <li class="dropdown-header">
        {{ category.title }}
    </li>
    <li>
        <a href="{{ '/music/' + tag.keyword }}" *ngFor="#tag of category.tags" [hidden]="tag.deleted === 1">{{ tag.tag_title_da }}</a>
    </li>
    <li class="divider"></li>

    <li class="dropdown-header">Alle musikstykker</li>
    <li><a href="/music/all">Alle musikstykker</a></li>
    </template>
</ul>

更新角度^ 2.0.0

您可以使用ng-container,只需更改#var即可。

< NG-容器>行为与< template>相同但允许使用更常见的语法。

<ul class="dropdown-menu" role="menu">
  <ng-container *ngFor="let category of categories">
    <li class="dropdown-header">
      {{ category.title }}
    </li>
    <li>
      <a href="{{ '/music/' + tag.keyword }}" *ngFor="let tag of category.tags" [hidden]="tag.deleted === 1">{{ tag.tag_title_da }}</a>
    </li>
    <li class="divider"></li>

    <li class="dropdown-header">Alle musikstykker</li>
    <li><a href="/music/all">Alle musikstykker</a></li>
  </ng-container>
</ul>

大佬总结

以上是大佬教程为你收集整理的Ng-repeat-start in angular2 – aka使用NgFor重复多个元素全部内容,希望文章能够帮你解决Ng-repeat-start in angular2 – aka使用NgFor重复多个元素所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。
标签: