erwartete ich ein service
global und BehaviorSubject
mit für jetzt den BehaviorSubject
Eigenschaftswert in zwei Komponenten zu teilen ... Das ist mein Service:BehaviorSubject verwenden und nicht der Wert immer
@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);
}
}
Dies ist JobsComponent
, ich bin die setPartitionKey()
Methode meines Dienstes aufrufen und einen Wert als Parameter aus dieser Komponente vorbei:
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));
}
Dies ist JobsComponent html
:
<div class="jobContainer" *ngIf="isThereAnyJob === true">
<div *ngFor="let job of jobs">
<a (click)="select(job.PartitionKey)">{{job.Title}}</a>
</div>
</div>
Und das ist die Jobdetails Komponente:
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));
}
ich die JobsService globaly im @NgModule
bin setzen:
@NgModule({
imports://....
declarations://....
bootstrap: [AppComponent],
providers: [Globals, JobsService, MissionService]
})
export class AppModule {}
Also, wenn ich meine den partitionKeySource
Wert gesetzt Service Ich möchte zur JobDetails
Komponente navigieren, um die Details dieses Jobs anzuzeigen, die den Wert partitionKey
verwenden, verwende ich global servic e und BehaviorSubject
denn ich will in der URL die partitionKey
Wert nicht angezeigt ...
Wenn es den Wert von partitionKey
JobDetails
navigiert ist der Standard ein Satz auf dem JobsService
anstelle des Job
partitionKey
insbesondere .. . ich console.log()
drucken die Reihenfolge und den PartitionKey Wert der beiden Komponenten, die ich sein möchte das gleiche ...
Dies ist, was gedruckt bin mit wird:
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
Ich möchte, dass der partitionKey-Wert in beiden Komponenten gleich ist (01f1f352-51e0-474e-962b-a75a56925342d
) ... Warum erhält JobDetails
den Standardwert, wenn dies vor der Verwendung von JobsComponent
geändert wird?
Fügen Sie den Anbietern Ihrer Komponente 'JobsService' hinzu? Oder nur zu den Providern von AppModule – LLai
@LLai Nur zu den Providern von AppModule ... – AlexGH
Von der Reihenfolge Ihrer Konsolenprotokollausgabe scheint es, dass es mehrere Instanzen von JobsService gibt, aber wenn es nur in AppModule bereitgestellt wird, sollte es nicht Sein. Sie könnten versuchen, den '.subscribe' in Ihrer JobDetails-Komponente vom Konstruktor in den ngOnInit zu verschieben. – LLai