Pass URL on button click ionic

Issue

I am creating an ionic app which read data from json url. There are two pages.

I want to pass the url on button click from 1st page to 2nd page so that in 2nd page the url is read and data is displayed.

1st Page: Home 2nd Page: Home-details.

My home.html looks like below:

<button ion-button color="primary" round full style="height: 50px;" (click)="start($event, item)" [disabled]="startbuttonDisabled">
START!
</button> 

My home.ts looks like below:

start(event: any,item: any) {
this.navCtrl.push(homedetailspage, {
item:item
});
}

My home-details.ts looks like below:

constructor(public navCtrl: NavController, public navParams: NavParams, protected httpClient: HttpClient, public alertCtrl: AlertController) {

this.value = navParams.get('item');
console.log(this.value);

this.httpClient.get(this.value)
      .subscribe((res: any) => {
        this.jsonitems = res;
        },
      error=>{
        console.log(error);
      } );
}

I want to pass the JSON url "assets/data/data.json" in the variable "item" to the 2nd page home-details.ts

Please suggest me where i am doing the mistake.

Solution

The following changes were made and the issue is resolved.

In home.ts, below is the updated code:

start(event: any,item: any) {
this.navCtrl.push(homedetailspage, {
item:'assets/data/data.json'
});
}

In home-details.ts, below is the updated code(removed from constructor):

ionViewDidLoad() {
    this.value = this.navParams.get('item');
    console.log("url", this.value);
   
    this.httpClient.get(this.value)
      .subscribe((res: any) => {
        this.fullbodyitems = res;
        },
      error=>{
        console.log(error);
      } );
  }

Answered By - Bongaigaon Gapps