2017-02-23 70 views
0

我有一個提供者服務,它調用從我的API獲取請求。然後我有一個列表頁面,你可以滾動許多食譜。我正在努力的是將每個配方的ID並傳遞到詳細信息頁面,因爲這需要包括在內。Ionic 2 - 將json的ID傳遞給子頁面(細節)頁面

我的服務請求是爲上市是

loadCategory1() { 
    var url = "http://api.yummly.com/v1/api/recipes?_app_id=////&_app_key=////"; 

    if (this.Category1) { 
    return Promise.resolve(this.Category1); 
    } 

    return new Promise(resolve => { 
    this.http.get(url + "&allowedAllergy[]=396^Dairy-Free&allowedAllergy[]=393^Gluten-Free&maxResult=50&start=10") 
     .map(res => res.json()) 
     .subscribe(data => { 
     console.log(data); 
     this.Category1 = data.matches; 
     resolve(this.Category1); 
     }); 
    }); 
} 

和我現在有我的詳細信息以及

loadDetails() { 
    if (this.details) { 
    return Promise.resolve(this.details); 
    } 

    return new Promise(resolve => { 
    this.http.get('http://api.yummly.com/v1/api/recipe/French-Onion-Soup-The-Pioneer-Woman-Cooks-_-Ree-Drummond-41364?_app_id=//////&_app_key=//////') 
     .map(res => res.json()) 
     .subscribe(data => { 
     console.log(data); 
     this.details = data; 
     resolve(this.details); 
     }); 
    }); 
} 

正如你可以在細節上看到要求一個獨立的我有法國 - 先鋒 - 先鋒 - 女人 - 廚師-_- Ree-Drummond-41364這需要通過從每個食譜中獲取ID進行動態分析。示例如下。

enter image description here

在每個.TS文件我有以下

loadRecipes(){ 
    this.apiAuthentication.loadCategory1() 
    .then(data => { 
     this.api = data; 
    }); 
    } 

這讓我打電話請求。

我現在在這個地方,我不知道該怎麼做,所以一些幫助會很棒。

+0

你必須在你的項目結構中有全局的variable.ts文件! – devanshsadhotra

+0

問題是您在apiAuthentication.ts文件中以及您的每個.ts文件中都訂閱了兩次嘗試僅在每個.ts文件中訂閱 –

回答

0

你DetailsS​​ervice可以是這樣的:

loadDetails(detailsId: string) {  
    return new Promise(resolve => { 
    this.http.get('http://api.yummly.com/v1/api/recipe/'+detailsId+'?_app_id=//////&_app_key=//////') 
     .map(res => res.json()) 
     .subscribe(data => { 
     console.log(data); 
     this.details = data; 
     resolve(this.details); 
     }); 
    }); 
} 

導航到DetailsPage帶參數:

this.navCtrl.push(DetailsPage,{ 
      recipe: recipe 
      }); 

,您可以通過使用像這樣的代碼中調用裏面DetailsPage DetailsS​​ervice:

loadDetails(){ 
    this.apiAuthentication.loadDetails(this.recipe.id) 
    .then(data => { 
     this.details = data; 
    }); 
    }