Angular 2 – 将textarea值发送到共享组件

我在第一页有一个textarea,当我转到下一页时,我需要将此值显示在下一页中共享的记事本组件中,但同时我需要在首先在共享组件中写入新信息时并且可以保存和显示新信息.我需要使用angular2,我不能使用github.enter图像描述中的任何东西

由于它不是父子关系,您可以使用共享服务并使用setter和getter传递textarea值.

例：

form.component.ts：

@Component({
  selector: 'form1-component',template: `
    <h3>Form 1</h3>
        <textarea [(ngModel)]="input"></textarea>
        <button (click)="save(input)">Save</button>
  `,})
export class Form1 {
  input: any;

  constructor(private appState: AppState){

  }

  save(val){
    this.appState.setData(val);
  }
}

shared.service.ts：

@Injectable()
export class AppState {
  public formData;

  setData(value){
    this.formData = value;
  }

  getData(){
    return this.formData;
  }
}

other.component.ts：

@Component({
  selector: 'summary',template: `
    <h3>Summary From Form 1</h3>
    <div>{{data}}</div>
  `,})
export class Summary {
  data: any;

  constructor(private appState: AppState){
    this.data = this.appState.getData();
  }
}

Plunker demo