在帶有angular2的服務中注入表單值

Question

我正在嘗試使用服務將表單（mdf）的輸入值傳遞給另一個組件。這是我的服務：

sharedData.service.ts

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

@Injectable()
export class SharedDataService {
    eventData: any=[];

    constructor() {}
    setEventData(data: any)
    {
      this.eventData.push(data);
    }

    getEventData()
    {
      return this.eventData;
    }
}

在第一個組件中，當我單擊按鈕時，我想將表單值傳遞給服務：

formData.component.html

<form [formGroup]="eventForm" novalidate (ngSubmit)="eventForm.valid && add(eventForm.value)">
<fieldset>
<input  name="title" formControlName="title" type="text">
......
<a [routerLink]="['/preview']" target="_blank" class="btn btn-primary" (click)="preview(eventForm.value)">Preview</a>
......
</fieldset>
</form>

formData.component.ts

preview(eventData: any)
  {
    this.sharedData.setEventData(eventData);
  }

preview.component.ts

ngOnInit() {
    this.eventData=this.sharedData.getEventData();

  }

但什么都沒有出現

preview.component.html

<b>Event Title: </b> {{eventData.title}}

Answer 1

好的。嘗試以下代碼。 它可能會有所幫助：-嘗試添加RxJ來設置和獲取數據。示例：

import { Injectable ,Input } from '@angular/core';
import { BehaviorSubject }    from 'rxjs/BehaviorSubject';

@Injectable()
export class SharedDataService {

    private eventDataDetails = new BehaviorSubject<Object>(this.details);
    eventDataDetailsAsObservable = this.eventDataDetails.asObservable();
    eventData: any=[];

    setEventData(data : Object){
        this.eventDataDetails.next(data);
    }

    getEventData(){
        return this.eventDataDetails.getValue();
    }
}

在您的組件中：import sharedService;

在預覽組件的構造函數中，在下面的行中編寫：

this.sharedDataService.eventDataDetailsAsObservable.subscribe(
            (eventDataResponse: any) => {
                // Your logic here
                this.eventData=this.eventDataResponse;
    });