Passing data to sub-component in ionic 3

Ionic Framework ionic-v3
1

Hi , I am trying to pass data to a sub component

I have a component called news-feed and sub component posts

I have added a file posts.ts in the news feed folder , so the structure is like this:

 ~~news-feed
   ~~news-feed.html
   ~~news-feed.module.ts
   ~~news-feed.scss
   ~~news-feed.ts
   ~~posts.ts

news-feed.module.ts:

  //
  @NgModule({
   declarations: [
     NewsFeed,
     PostDetailComponent
   ],
   imports: [
     IonicPageModule.forChild(NewsFeed),
   ],
   exports: [
     NewsFeed,
     PostDetailComponent
   ]
 })
 //

news-feed.ts:

 //
 constructor(public navCtrl: NavController, 
          public navParams: NavParams,
          private postService: PostService) {

            postService.getPosts(this.limit, this.offset).subscribe(res => {
              this.posts = res;
            });
  }

news-feed.html:

 //
 <ion-content padding>
   <div *ngFor="let post of posts">
      <post-detail [post]="post">
      </post-detail>
   </div>
 </ion-content>

posts.ts:

import { Component, Input } from '@angular/core';

 @Component({
   selector: 'post-detail',
   template:`
     <p>count: {{likesCount}}</p>
   `
  })

   export class PostDetailComponent {
    @Input() post;
 
   constructor (){
       console.log(this.post)
   }
  }

When I console.log(this.post) I get undefined !!

2

That’s because the constructor is too early. You can’t access bound input properties until ngOnChanges().

3

can u show an example of where to use ngOnChanges() … if it isn’t much trouble , thanx

4

RTFM.