Displaying posts, comments, and likes
After partially implementing our presentational post component, let's see how to use it in the parent user's profile component and use its input properties and custom events to communicate between the child and parent. Here are the steps we need to follow:
- First, we need to include the
postcomponent in the profile component, so open theusers/components/profile/profile.component.htmlfile and add the following markup in the<div>element, with theposts-columnclass, below the<app-create-post>component:<div *ngFor="let post of posts;"> <app-post [post]="post" [authUser]="authUser" (remove)="onRemovePost($event)"> </app-post> </div>
We include a component in the template using the value of the selector attribute in the component's decorator, which is app-post in this case.
We can invoke this component...