【发布时间】:2018-11-30 03:16:41
【问题描述】:
我希望将值从 Tabs 组件传递到 Task 组件,我创建了一个单独的数据服务。 Tabs 中的值作为参数从其他组件中获取。在尝试将值从选项卡传递到任务组件时,它在任务页面中给了我“未定义”。
我的服务类
import { Injectable} from '@angular/core';
@Injectable()
export class DataService {
list:any;
getUserData(){
return this.list;
}
setUserData(data:any){
this.list = data;
}
}
标签组件
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import { SettingsPage } from '../settings/settings';
import { TasksPage } from '../tasks/tasks';
import { DataService } from "../../services/data.service";
@Component({
templateUrl: 'tabs.html',
providers:[DataService]
})
export class TabsPage {
tab1Root = TasksPage;
tab2Root = SettingsPage;
user:any;
constructor(public navCtrl: NavController, public navParams: NavParams,public dataService: DataService) {
this.user = navParams.get('param1');
this.dataService.setUserData(this.user);
}
}
任务页面
import { Component,ViewChild } from '@angular/core';
import { DataService } from "../../services/data.service";
import { TabsPage } from '../tabs/tabs';
import { TasksCreatePage } from '../tasks-create/tasks-create';
const logger = new Logger('Tasks');
@Component({
selector: 'page-tasks',
templateUrl: 'tasks.html',
providers:[DataService]
})
export class TasksPage {
usern:any;
constructor(public dataService: DataService){
this.usern = this.dataService.getUserData();
console.log(this.usern);
}
【问题讨论】:
-
通过使用
providers:[DataService]你告诉 Angular 创建DataService的单独实例而不是使用单例。 -
谢谢,解决了我的问题。
标签: angular typescript ionic-framework ionic3