在angular2中，需要将数据从一个组件发送到另一个组件

import { Component, Input } from '@angular/core';

@Component({
  selector: 'app-target',
  template: '<p>{{ data }}</p>'
})
export class TargetComponent {
  @Input() data: any;
}

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

@Component({
  selector: 'app-source',
  template: '<app-target [data]="myData"></app-target>'
})
export class SourceComponent {
  myData: any = 'Hello, World!';
}

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

@Injectable()
export class DataService {
  sharedData: any;
}

import { Component } from '@angular/core';
import { DataService } from './data.service';

@Component({
  selector: 'app-source',
  template: '<button (click)="sendData()">Send Data</button>'
})
export class SourceComponent {
  constructor(private dataService: DataService) {}

  sendData() {
    this.dataService.sharedData = 'Hello, World!';
  }
}

import { Component } from '@angular/core';
import { DataService } from './data.service';

@Component({
  selector: 'app-target',
  template: '<p>{{ data }}</p>'
})
export class TargetComponent {
  constructor(private dataService: DataService) {}

  get data() {
    return this.dataService.sharedData;
  }
}

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { SourceComponent } from './source.component';
import { TargetComponent } from './target.component';

const routes: Routes = [
  { path: 'source', component: SourceComponent },
  { path: 'target/:data', component: TargetComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

import { Component } from '@angular/core';
import { Router } from '@angular/router';

@Component({
  selector: 'app-source',
  template: '<button (click)="sendData()">Send Data</button>'
})
export class SourceComponent {
  constructor(private router: Router) {}

  sendData() {
    this.router.navigate(['/target', 'Hello, World!']);
  }
}

import { Component } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Component({
  selector: 'app-target',
  template: '<p>{{ data }}</p>'
})
export class TargetComponent {
  data: string;

  constructor(private route: ActivatedRoute) {}

  ngOnInit() {
    this.data = this.route.snapshot.paramMap.get('data');
  }
}