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

Angular2 ngFor产生额外的循环

1 个答案: