使用on button click ionic将数据显示到其他页面?

问题描述 投票:0回答:1

我有这种反应

{
    "value": [
        {
            "AttachmentFiles": [
                {
                    "odata": "SP.Attachment",
                    "odata": "AttachmentFiles('b1.jpg')",
                    "odata": AttachmentFiles('b1.jpg')",
                    "FileName": "b1.jpg"
                }
            ],
            "Id": 1,
            "Title": "Article #1",
            "LongStory": "is designed to convey the business impact it generates.",
            "SortStory": "professional services firm ",
            "ArticleCategory": "News",

        },
        {
            "AttachmentFiles": [
                {
                    "odata": "SP.Attachment",
                    "odata": "https://('b3.jpg')",
                    "odata": "/AttachmentFiles('b3.jpg')",
                    "FileName": "b3.jpg"
                }
            ],
            "Id": 2,
            "LongStory": "In June 2017",
            "SortStory": "is a professional services
            "ArticleCategory": "News",
            "Title": "Article #2",

        }
    ]

}

我必须在另一页上以“FileName”值显示长篇故事。

我的html代码如下

<ion-content padding style="background:reds!important;" class="no-scroll">
    <ion-slides #slider (ionDidChange)="SlideChanged()" [options]="_sliderOptions" id="ionSlider" >
            <ion-slide #slide *ngFor="let robot of _robots; let i = index " >
                    <ion-item >
                             <div attr.id="Testing{{i}}"></div>>
                        <h1>{{robot.Title}}</h1>
                        <p>{{robot.SortStory}}</p>
                    </ion-item>
                    <button ion-button (click) = "goToLongStory()" icon-start large round color="dark">
                            <ion-icon name="star"></ion-icon>
                            clike me m8
                          </button>
                </ion-slide>
    </ion-slides>
</ion-content>

可以任何人帮助我,在每张幻灯片上我有按钮和按钮点击我必须显示相关数据到其他页面,如长篇故事,标题,文件名。

请帮我 。

ionic2 pass-data
1个回答
1
投票

在你的构造函数中

`public navCtrl: NavController,

比你的函数goToLongStory()传递你想要访问的索引,并使用你需要的索引过滤长篇故事。然后只需调用新页面并传递参数。

this.navCtrl.push('newPage', { longStory: LongStory });

在“newPage”页面上,您需要将以下内容添加到构造函数中:

public navParams: NavParams

而不是从NavParams获取LongStory到您选择的变量。

let yourNewVariable: string = navParams.get("LongStory ");

© www.soinside.com 2019 - 2024. All rights reserved.