Question

关注* ngFor

<ul>
  <li *ngFor="#todo of todoService.todos">
    {{todo}}
  <li>
</ul>

其中todoService是注入接口

import {Injectable} from 'angular2/core';

@Injectable()
export class TodoService {
    todos = []
}

当我加载页面时，输出为<li></li>而不是任何内容。

知道为什么吗？由于数组是空的，因此不应该是<li> - 标记

修改当我用值初始化数组时，它也会出现。无缘无故地总是有一个尾随空元素。

EDIT2 问题的例子 https://plnkr.co/edit/MRYC4MHtlDLfBMUPsL6o?p=preview

Answer 1

啊是的:)你可以对这些问题视而不见，即使解决方案有时过于简单。

我相信您希望底部<li>成为结束标记？这可能只是解决了你的问题：

<ul>
  <li *ngFor="#todo of todoService.todos">
    {{todo}}
  </li>  <!-- this nagger right here -->
</ul>

Answer 2

我无法用beta1重现您的问题：

@Component({
  selector: 'my-app', 
  template: `
    <div>
      Test:
      <ul>
        <li *ngFor="#l of service.list">{{l}}</li>
      </ul>
    </div>
  `
})
export class AppComponent {
  constructor(private service:Service) {

  }
}

请参阅此plunkr：https://plnkr.co/edit/hGpCIZQghtMBbpplV9tV?p=preview。

您使用的是哪个版本的Angular2？

亨利

* ngFor显示空数组中的元素

2 个答案: