Question

我有一项服务，我正在尝试在两个组件之间共享数据我已将服务放入module.ts提供程序但是没有其他组件提供者数组。我有这个服务：在ReferralComponent和ReferMenuComponent

的构造函数中的ReferralDataService

当我运行应用程序时，我收到此错误：错误错误：未捕获（在承诺中）：错误：没有ReferralDataService的提供程序

但是，如果我将此服务放入每个组件中，我就不会收到错误。但我不能获得共享数据

那么如何解决这个问题？

module.ts（相关部分）

import { ReferMenuComponent } from './components/referMenu/referMenu.component';
import { ReferralComponent } from './components/referral/referral.component';
import { ReferralDataService } from './services/referralData.service';
@NgModule({
imports: [BrowserModule, ReactiveFormsModule, HttpModule, routing],
declarations: [AppComponent, HomeComponent, LoginComponent,
                ReferMenuComponent, ReferralComponent],
providers: [{ provide: APP_BASE_HREF, useValue: '/' },    
            AuthenticationService,ReferralDataService
           ],
    bootstrap: [AppComponent]
})

export class AppModule { }

服务：

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

@Injectable()
export class ReferralDataService {
    public referralData: any;
}

ReferralComponent

import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Observable } from 'rxjs/Rx';
import { ReferralDataService } from '../../Services/referralData.service';
import { ActivatedRoute, Router } from '@angular/router';

@Component({

    templateUrl: 
'appThirdParty/app/Components/referral/referral.component.html',
    //providers: [ReferralDataService]
})
export class ReferralComponent implements OnInit {
    userFrm: FormGroup;
    referralData: {};
    routeOption: number;
    constructor(private fb: FormBuilder, private referralDataService: 
ReferralDataService, private route: ActivatedRoute) { }

    ngOnInit(): void {
        this.userFrm = this.fb.group({
        });
        this.referralData = this.referralDataService.referralData;
        this.routeOption = this.route.snapshot.params['option'];
    }

}

ReferMenuComponent

import { Component, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { Observable } from 'rxjs/Rx';
import { ReferralDataService } from '../../Services/referralData.service';
import { Router } from "@angular/router";
import { IPatient } from '../../Model/patient';
import { IHostData } from '../../Model/hostData';

import { DataRequestsToHost } from '../../Services/dataRequestsToHost.service';


@Component({

    templateUrl: 
'appThirdParty/app/Components/referMenu/referMenu.component.html',
    providers: [ DataRequestsToHost]
})
export class ReferMenuComponent implements OnInit {
    userFrm: FormGroup;
    option: number;
    dataFromHost: {};
    constructor(private fb: FormBuilder, private referralDataService: 
ReferralDataService, private router: Router, private hostRequester: 
DataRequestsToHost) { }

     ngOnInit(): void {
        this.userFrm = this.fb.group({
         });
     }
    Option1Click() {
        this.option = 1
        this.getDataFromHost(this.option);
        this.sendDataToReferralService();
         this.router.navigate(["referral", { option: this.option }]);
    }
    Option2Click() {
         this.option = 2
         this.getDataFromHost(this.option);
        this.sendDataToReferralService();
        this.router.navigate(["referral", { option: this.option }]);
     }
     Option3Click() {
         this.option = 3
        this.getDataFromHost(this.option);
        this.sendDataToReferralService();
        this.router.navigate(["referral", { option: this.option }]);
    }
    getDataFromHost(option: number) {

        //var results = this.hostRequester.requestHostPatientData();
        this.dataFromHost  = this.requestThisPatientData();
    }
    sendDataToReferralService() {
        this.referralDataService.referralData = this.dataFromHost;
    }
    private requestThisPatientData(){
          console.log('GOT TO parent requestCurrentPatientData function');
         var currentUserTokenStr = localStorage.getItem('currentUserToken');
        var currentUserToken = JSON.parse(currentUserTokenStr);
        var currentProviderTokenStr = 
 localStorage.getItem('currentUserToken');
         var currentProviderToken = JSON.parse(currentProviderTokenStr);
        let patientData: IPatient = <IPatient>{};
        patientData.Id = 12345678;
    patientData.FirstName = 'Fred';
    patientData.LastName = 'Nurk';
    patientData.Gender = 'Male';
    patientData.StreetAddress = '3 Bowen Cresent';
    patientData.Suburb = 'Albert Park';
    patientData.State = 'Vic';
    patientData.Postcode = '3206';

    let returnObj: IHostData = <IHostData>{};
    returnObj.UserToken = currentUserToken;
    returnObj.ProviderToken = currentProviderToken;
    returnObj.Patient = patientData;
    return returnObj;
}
 }

Answer 1

在您的模块中，您导入了

import { ReferralDataService } from './services/referralData.service';

但是在导入的组件中

import { ReferralDataService } from '../../Services/referralData.service';

区别在于＆＃34;服务＆＃34;和＆＃34;服务＆＃34;

角度共享2个组件之间的数据

1 个答案: