Angular2 无法绑定到 child 数组

Question

我有一个 JSON object 如下所示：

{
  "sessions": [
    {
      "title": Session Title,
      "room": "Ballroom A"
    },
    {
      "title": Session Title #2,
      "room": "Ballroom B"
    }
  ],
  "speakers": [
    {
      "name": John Doe,
      "twitter": "jdoe"
    },
    {
      "name": John Smith,
      "twitter": "jsmith"
    }
  ]
}

我正在尝试绑定到 object 的会话 child。完整的 object 在一个名为 conferenceData 的变量中，我用来显示标题的代码是：

<div *ngFor="#session of conferenceData.sessions">{{session.title}}</div>

当我执行此操作时，出现错误：TypeError: 无法读取 ProductListComponent@65:17 中 [conferenceData.sessions 中未定义的属性 'sessions'

如果我将 child 分配给一个变量：

this.sessionData = this.conferenceData.sessions;

然后改为绑定到 sessionData 变量，它按预期工作。这是使用 TypeScript 和 Angular 2。我想这可能是 TypeScript 的类型问题，但我认为这时候都是 JavaScript。任何帮助，将不胜感激。

谢谢！

Answer 1

这可能是因为 this.conferenceData 尚未分配，当 Angular 第一次呈现您的视图时。

您可以使用 elvis 运算符轻松解决此问题：

<div *ngFor="#session of conferenceData?.sessions">{{session.title}}</div>

Answer 2

问题是时间获取json数据，组件没有数据时angular 呈现视图。 解决方案 使用 'elvis' (?) 运算符来确保数据准备就绪： - <code><div *ngFor="#session of conferenceData?.sessions"> {{session.title}} </div> 第二个解决方案是隐藏 ngFor直到conferenceData 是准备就绪： <div *ngIf="conferenceData"> <div *ngFor="#session of conferenceData.sessions"> {{session.title}} </div> </div>

Angular2 无法绑定到 child 数组

Angular2 Cannot bind to child array

binding

typescript

ngfor

angular