如何将数据从一页发送到另一页？使用离子和角度答案

【问题标题】：How to send the data from one page to another page? using ionic and angular如何将数据从一页发送到另一页？使用离子和角度
【发布时间】：2020-01-30 22:59:01
【问题描述】：

该项目有一个选项卡部分，其中我有两个页面 1.食谱页面 2. 最喜欢的

在食谱页面中，它们是一个食谱列表，我在每个列表的末尾添加了一个添加图标按钮。如何通过单击添加图标按钮将列表从食谱页面发送到收藏页面。

请帮帮我

离子，角度

【问题讨论】：

您可以在父页面中创建列表，并将该列表的引用传递给两个选项卡。

标签： angular ionic-framework

【解决方案1】：

如果您想将选项从一个页面发送到另一个页面，这是一个好方法。

首先，您必须列出选项，选择一个时，您会推送到另一个页面

在 index.html 中：

<ion-card *ngFor= "let elemento of resultado.list;  let i = index"></ion-card>

recipes.js：

this.navCtrl.push( FavoritePage,{op: i} );

【讨论】：

【解决方案2】：

在这种情况下，最常用的解决方案是调用服务。你调用一个服务来存储你想要的数据，然后在另一个页面上调用它。如果您对如何做有任何疑问并且从未做过服务，请随时询问。

【讨论】：

【解决方案3】：

我知道有两种方法。

使用服务。（我更喜欢这个）

data.service.ts

import { Injectable } from '@angular/core';

@Injectable()
export class dataService {
    data: string;

    setData(data) {
        this.data = data;
    }

    getData(){
       return this.data;
    }
}

App.component.ts

import { Component } from '@angular/core';
import { dataService } from './server.service';

@Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
})
export class AppComponent {

  constructor(private dataService: dataService){}

  getData() {
      retrun this.dataService.getData();
  }

}

2) 使用导航控制器

this.navCtrl.push(HomePage, {
      data: userData
});

在主页上，您可以像这样访问传递的数据

constructor(public navCtrl: NavController, public navParams: NavParams) {
    this.userData = navParams.get('data');
}

【讨论】：