Question

我现在使用service全局和BehaviorSubject分享两个组件中的BehaviorSubject属性值... 这是我的服务：

@Injectable()
export class JobsService {
private partitionKeySource = new BehaviorSubject("not retrieved yet");

    partitionKey$ = this.partitionKeySource.asObservable();

    constructor(private _http: Http) {

    }

  getJobs(): Observable<Job[]> {
    return this._http.get(this._jobsUrl).map((response: Response) => <Job>response.json())
   .catch(this.handleError);
    }

    setPartitionKey(partitionKey: string) {
        this.partitionKeySource.next(partitionKey);


      }
}

这是JobsComponent，我正在调用我的服务的setPartitionKey()方法，并将值作为参数传递给它：

export class JobsComponent implements OnInit {
 ngOnInit(): void {
this._jobsService.getJobs().subscribe((data: Job[]) => {//...some code})};
constructor(private _jobsService: JobsService, private router: Router) {}
select(partitionKey: string) {
        this._jobsService.setPartitionKey(partitionKey);
        this._jobsService.partitionKey$.subscribe(response => {
            console.log('from jobs component the partitionKey value is: ' + response);
            console.log('after getting the response jobsComponent');
            this.router.navigateByUrl('/app/job_details');
        }, error => console.log('there was an error: ' + error));
    }

这是JobsComponent html：

<div class="jobContainer" *ngIf="isThereAnyJob === true">
    <div *ngFor="let job of jobs">
        <a (click)="select(job.PartitionKey)">{{job.Title}}</a>
    </div>
</div>

这是JobDetails组件：

export class JobDetailsComponent{
constructor( private _jobsService: JobsService) {
        console.log('constructor called from JobDetails');
        this._jobsService.partitionKey$.subscribe(response => {
                console.log('from job details Component the partitionKey value is: ' + response);
            },
            error => console.log('there was an error from job details component: ' + error));
    }

我将JobsService全局置于@NgModule：

中

@NgModule({
    imports://....
    declarations://....
    bootstrap: [AppComponent],
    providers: [Globals, JobsService, MissionService]
})
export class AppModule {}

因此，当我设置服务的partitionKeySource值时，我想导航到JobDetails组件，以使用partitionKey值显示该作业的详细信息，我是使用全球服务和BehaviorSubject，因为我不想在网址中显示partitionKey值...

当导航到JobDetails时，partitionKey的值是JobsService上的默认值，而不是Job partitionKey ... 我使用console.log()打印订单和两个组件的partitionKey值，我希望它们是相同的......

这就是正在印刷的内容：

from jobs component the partitionKey value is: 01f1f352-51e0-474e-962b-a75a56925342d 
after getting the response jobsComponent
constructor called from JobDetails
from job details Component the partitionKey value is: not retrieved yet

我希望两个组件中的partitionKey值相同（01f1f352-51e0-474e-962b-a75a56925342d）...为什么JobDetails在使用JobsComponent之前更改了默认值？

Answer 1

从提供的控制台日志输出的顺序看，您的服务有多个实例。从组件提供程序中删除JobsService的所有实例，并将其保留在AppModule的providers数组中

@Component({
    providers: [ JobsService ] // remove this
})

这将使JobsService成为可以在应用程序中的所有组件之间共享的单例服务。

使用BehaviorSubject但没有获得预期的值

1 个答案: