ngFor repeating Components
<p>I have two components one is Post:</p>

<pre><code>import {Component} from '@angular/core';

@Component({
    selector: 'post',
    template: `
    &lt;h1&gt;{{title}}&lt;/h1&gt;
    &lt;p&gt;{{postText}}&lt;/p&gt;
    `
})
export class Post {
    title : string;
    postText : string;
    constructor(title:string, postText:string) {
        this.title  = title;
        this.postText = postText;
    }
}
</code></pre>

<p>the other is newsfeed: </p>

<pre><code>import {Component} from '@angular/core';
import {Post} from "./app.post.component";

@Component({
    selector: 'news-feed',
    template: `
    &lt;h1&gt;News Feed&lt;/h1&gt;
    &lt;ul *ngFor='#post of posts'&gt;
        &lt;li *ngFor='#post of posts'&gt;
            {{post | json}}
        &lt;/li&gt;
    &lt;/ul&gt;
    `
})
export class NewsFeed {
   posts : Post[];
    constructor() {
        let p1 = new Post("Post1","Wow greate post");
        let p2 = new Post("Such Post", "WoW");
        this.posts =[];
        this.posts.push(p1);
        this.posts.push(p2);
    }
}
</code></pre>

<p>Is there a way for me to repeat each post using the template in post rather than just using object syntax or formatting the post inside of the newsfeed. Perhaps I am approaching this the wrong way as I am new to ang2. Any help is appreciated.</p>

<p>Thank you very much.</p>