Question

我想知道我是否在做正确的事。我下面有一个对象。我想要的是在每个文档中循环以单独显示它。

我想知道创建动态页面是否正确。或者只是使用一页并在那里进行迭代。

尽管我还不知道如何编码。

[
    {
        "text": "This will be displayed in a page/display"
    },
    {
        "text": "This will be displayed separately"
    },
    {
        "text": "This will be displayed separately also."
    }
]

当前，页面加载时我得到了所有对象，但是它显示了所有对象。

ionViewDidLoad() {
    this.http.get('assets/howIGotHere.json')
    .map( response => response.json())
    .subscribe( data => console.log(data ))
  }

Answer 1

您已经提到过要在每个文档中循环显示以单独显示，可以使用以下代码在新页面中打开每个文档。该用户体验不是非常用户友好。我建议您列出ion-list中的所有文本项，然后单击ion-list项并按Details Page

ParentPage.ts

class ParentPage{

 constructor(public navCtrl:NavController){
 }

ionViewDidLoad() {
    this.http.get('assets/howIGotHere.json')
    .map( response => response.json())
    .subscribe( data => {
        console.log(data);
        data.foreach(item=>{
            //Push a new page with text(i.e. item) passed as navparam
            this.navCtrl.push(DetailsPage,{pagetext:item});
        })
    })
}

}

DetailsPage.ts

class DetailsPage{

     //Text to be displayed on HTML page
     pageText;

     constructor(public navParams:NavParams){

         //Assign nav params value to pageText
         this.pageText=this.navParams.get('text')
    }
 }

Ionic 3在不同页面中显示每个对象

1 个答案: