将返回值从php api数组传递到另一个页面

问题描述：

In my ionic app I tried passing array returned from a php api to another page but it was not passing any values

In user.html page I have the button that when click pass the value to the next page

<button ion-button icon-only (click)="goToResult()">
    <ion-icon ios="ios-log-out" md="md-log-out" class="user"></ion-icon> Next
</button>

userHome.ts

ngOnInit(){

this.phone = this.navParams.get('phone');


var headers = new Headers();

headers.append("Accept", 'application/json');

headers.append('Content-Type', 'application/json' );

let options = new RequestOptions({ headers: headers });

let data = {

    phone: this.phone

     };

let loader = this.loading.create({

content: 'Loading Page Contents',

});

loader.present().then(() => {

this.http.post('http://mypro.com/eApi/retrieve.php',data, options)

.map(res => res.json())

    .subscribe(res => {

     loader.dismiss()

    this.items=res.server_response;

    console.log(this.items);

    });

    });
    //this.navCtrl.push(PostPage, data); 
  }

On the same page, this is the push nav I tried passing the values through

goToResult(){
    console.log(this.items);
      this.navCtrl.push(PostPage,
        this.postList = this.items
      )

  }

In post.ts, I added this to the contructor

this.navParams.get(this.postList);

then in my post.html

<ion-title *ngFor="let post of postList">{{post.Name}}
        </ion-title>

Please, how can I pass the return values from the api to another page?

Thanks.

在我的离子应用程序中，我尝试将从php api返回的数组传递到另一个页面，但它没有传递任何值

在user.html页面中，我有一个按钮，当点击将值传递到下一页 p>

 ＆lt; button ion-button icon  -only（click）=“goToResult（）”＆gt; 
＆lt; ion-icon ios =“ios-log-out”md =“md-log-out”class =“user”＆gt;＆lt; / ion- 图标＆GT; 接着
＆LT; /按钮＆GT; 
 代码>  PRE> 
 
   userHome.ts 强>  p> 
 
 
  ngOnInit（  ）{
 
this.phone = this.navParams.get（'phone'）; 
 
 
var headers = new Headers（）; 
 
headers.append（“Accept”，“application / json”）  ; 
 
headers.append（'Content-Type'，'application / json'）; 
 
let options = new RequestOptions（{headers：headers}）; 
 
let data = {
 
 phone：  this.phone 
 
}; 
 
let loader = this.loading.create（{
 
content：'Loading Page Contents'，
 
}）; 
 
 
loader.present（）。然后 （（）=＆gt; {
 
this.http.post（'http://mypro.com/eApi/retrieve.php',data,options）
 
.map（res =＆gt; res.json  （））
 
 .subscribe（res =＆gt; {
 
 loader.dismiss（）
 
 this.items = res.server_response; 
 
 console.log（this.items）; \  n 
}）; 
 
}）; 
 //this.navCtrl.push(PostPage,data）;  
} 
  code>  pre> 
 
 在同一页面上，这是我尝试通过 p> 
 
 
 传递值的推送导航 goToResult（）{
 console.log（this.items）; 
 this.navCtrl.push（PostPage，
 this.postList = this.items 
）
 
} 
  code>   pre> 
 
 在post.ts中，我将它添加到了构造函数 p> 
 
 
  this.navParams.get（this.postList）; 
  code  >  pre> 
 
 然后在我的 post.html  strong>  p> 
 
 
 ＆lt; ion-title * ngFor =“发布信息 postList“＆gt; {{post.Name}} 
＆lt; / ion-title＆gt; 
  code>  pre> 
 
 请问，如何从api传递返回值 到另一页？ p> 
 
 
谢谢。 p> 
  div>

答

So if you check ionic doc example you will see that you need to pass data using json object and use its key to retrieve data, try this approach:

In your first component:

   this.navCtrl.push(PostPage,
        { postList: this.items } 
   )

In receiving component constructor;

this.postList = this.navParams.get(“postList”);

If still struggle please share full code, but this should be easy fix;)

答

you can do like this

goToResult(){
    console.log(this.items);
      this.navCtrl.push(PostPage, {postList = this.items})
}

In post.ts, you can get value by

this.navParams.get('postList');

将返回值从php api数组传递到另一个页面

相关推荐