Angular 2: passing object with nested object to child component
<p>I have nested object</p>

<pre><code>data: {
  nestedData: {
    title: 'string'
  }
};
</code></pre>

<p>I pass this data to child component via property</p>

<pre><code>&lt;child-component [data]="data"&gt;&lt;/child-component&gt;
</code></pre>

<p>Child component code:</p>

<pre><code>import {Component, Input} from 'angular2/core';

@Component({
  selector: 'cp-header',
  template: '&lt;div&gt;{{ data.nestedData.nestedData }}&lt;/div&gt;',
  styleUrls: ['app/header/header.component.css']
})
export class ChildComponent {
  @Input() data;
}
</code></pre>

<p>Then when I try to access object property in template I got error;</p>