使用angular2中的服务将数据传递给其他组件

我正在尝试使用服务将数据从“第一个”组件传递到“第二个”组件。但当我试图在“第二个”组件中检索数据时，它是未定义的

这是我的密码

import { Component, OnInit } from '@angular/core';
import {Router} from "@angular/router";
import { testData } from '../model/Data';
@Component({
  selector: 'app-first',
  templateUrl: './first.component.html',
  styleUrls: ['./first.component.css']
})
export class FirstComponent implements OnInit {
 public constructor(private router: Router,private mydata:testData) { 
    this.mydata={firstname:"Amit",lastname:"Kumar",Mobile:"12345"};
 }
ngOnInit() { }
} 

因为我在构造函数中设置了“myData”。这是“第二个”组件中的代码

import { Component, OnInit } from '@angular/core';
import {Router} from "@angular/router";
import { testData } from '../model/Data';
@Component({
  selector: 'app-second',
  templateUrl: './second.component.html',
  styleUrls: ['./second.component.css']
})
export class SecondComponent implements OnInit {
  public constructor(private mydata:testData) {
    console.log(this.mydata.firstname);
   }
  ngOnInit() {}
}

Data.ts

import { Injectable } from '@angular/core';
@Injectable()
export class testData{
    public firstname: string;
    public lastname: string;
    public Mobile:string;
    public constructor() { }
}

并更新了我的app.module.ts文件

@NgModule({
...
providers: [testData],
  bootstrap: [AppComponent]
})

“Second”组件不是“first”的子组件

---

当你做这个作业的时候

this.mydata={firstname:"Amit",lastname:"Kumar",Mobile:"12345"};

您没有分配服务的属性。您正在将

mydata

字段指定为另一个对象

我想你想做的是

this.mydata.firstname = "Amit";
this.mydata.lastname = "Kumar";
this.mydata.Mobile = "12345";

如果要引用整个对象，应使用文档中类似的

主题

：

---

注意：这种方法在某些情况下可能仍然不起作用；例如，如果

FirstComponent

无法足够快地设置字段，并且

SecondComponent

尝试在之前获取它们。

@echonax：当存在父子关系时，这些组件的示例。标题有点误导，但您的答案是在父子之间通过service@echonax：我读了那篇教程。但我能发现我的错误。因为我的服务是单身。所以我应该在“第二个”控制器中得到相同的实例。你能指出我的错误吗。