angularjs - Angular2 ngFor 产生额外的循环

Question

我正在尝试在 Angular 2 rc-1 中使用 ngFor，如下所示:

@Component({
    selector: 'myList',
    template: `<h2>Menu</h2>
                {{title}}
                <ul>
                    <li *ngFor="let menu of menus">
                        {{menu }}
                    <li>
                </ul>`
})
export class MenuComponent {
    title:string = "Our lunch menu";
    menus= ["Menu 1", "Menu 2", "Menu 3"];
}

我面临的问题是，它不是生成 3 个项目符号/列表，而是生成 4 个项目符号，最后一个项目符号没有任何文本。

有人知道为什么会发生这种情况或者我是否犯了任何错误？

谢谢

Answer 1

您的代码中有两个错误

1。您还没有导入CORE_DIRECTIVES在你的组件中 正如 @Gunter 在评论中所说，无需导入 CORE_DIRECTIVES因为它们默认作为 PLATFORM_DIRECTIVES 的一部分提供

为什么你的代码生成 3 个项目符号/列表，最终却有 4 个项目符号，最后一个项目符号没有任何文本。因为在您的代码中没有 </li> 的结束标记 所以用这个改变你的代码:-

<ul>
  <li *ngFor="#menu of menus; #i=index">
   {{menu}} {{i}} {{menus.length}}
  </li>
</ul>

工作示例 Working example