要显示的管道数据无效

Question

我使用 angular CLI、firebase 和 angularfire2。我想通过选择 firebase 键来显示特定数据，但控制台指示管道无效。有人可以帮我吗？

this.patientid 的值是 firebase 键 ...

// HTML

{{(patientToDisplay | async)?.nom}}

//组件

import { Component, OnInit, Inject } from '@angular/core';
import { Patient } from '../../models/patient.model';
import { ActivatedRoute, Router } from '@angular/router';
import { PatientsService } from '../../services/patients.service';
import { AngularFireDatabase, AngularFireList, AngularFireObject} from 'angularfire2/database';
import { Location } from '@angular/common';

@Component({
selector: 'app-single-patient',
templateUrl: './single-patient.component.html',
styleUrls: ['./single-patient.component.scss'],
providers: [PatientsService]
})

export class SinglePatientComponent implements OnInit {


patientId: string;
patientToDisplay;

constructor( 
private route: ActivatedRoute, 
private location: Location,
private patientsService: PatientsService,
private diagnosticsService: DiagnosticsService,
private router: Router, 
public dialog: MatDialog, 
private formBuilder: FormBuilder
) {}

ngOnInit() {
this.route.params.forEach((urlParameters) => {
this.patientId = urlParameters['id'];
});
this.patientToDisplay = 
this.patientsService.getSinglePatient(this.patientId);
console.log(this.patientId);

}

}

//服务

getSinglePatient(Patientid: string){
return this.database.object('patients/' + Patientid);
}

Answer 1

patientToDisplay: Observable<any>;

你也应该输入这个和你的 get req 但这是你让它工作后的一种形式:)

您收到无效管道错误的原因是您从未将 patientToDisplay 设置为可观察对象。异步管道需要一个可观察到的管道到

import { Component, OnInit, Inject } from '@angular/core';
import { Patient } from '../../models/patient.model';
import { ActivatedRoute, Router } from '@angular/router';
import { PatientsService } from '../../services/patients.service';
import { AngularFireDatabase, AngularFireList, AngularFireObject} from 'angularfire2/database';
import { Location } from '@angular/common';
import { Observable } from 'rxjs/Observable'

@Component({
selector: 'app-single-patient',
templateUrl: './single-patient.component.html',
styleUrls: ['./single-patient.component.scss'],
providers: [PatientsService]
})

export class SinglePatientComponent implements OnInit {


patientId: string;
patientToDisplay: Observable<any>;

constructor( 
private route: ActivatedRoute, 
private location: Location,
private patientsService: PatientsService,
private diagnosticsService: DiagnosticsService,
private router: Router, 
public dialog: MatDialog, 
private formBuilder: FormBuilder
) {}

ngOnInit() {
this.route.params.forEach((urlParameters) => {
this.patientId = urlParameters['id'];
});
this.patientToDisplay = 
this.patientsService.getSinglePatient(this.patientId);
console.log(this.patientId);

}

}

Answer 2

如果您想 return 从您的服务中观察到，请使用：

getSinglePatient(Patientid: string){
  return this.database.object('patients/' + Patientid).valueChanges();
}

要显示的管道数据无效

Invalid Pipe Datatodisplay

firebase

firebase-realtime-database

angularfire2

angular