订阅可观察对象时获取空数组
Getting an empty array on subscribing an observable
我在从服务订阅一个对象时在组件中得到一个空数组。
我使用了主题行为并尝试将数据从主题传递到组件,但在组件上返回了一个空数组。
服务:-
allPassedData: BehaviorSubject<any> = new BehaviorSubject<any>([]);
searchDepartments() {
const fetchData3 = this.db.todos.orderBy('department').keys((departments) => {
alert("Departments are: " + departments.join(','));
console.log(departments); //<============== ["data","accounts"]
console.log(typeof departments); //<========== object
this.allPassedData.next(departments);
});
}
getDep(): Observable<any[]> {
return this.allPassedData.asObservable();
}
组件
showTable() {
this.todoService.getDep().subscribe((departments)=>{
this.showDepartments = departments;
console.log(this.showDepartments); <=============== [] empty
})
试试这样的方法:
服务
departments$ = this.db.todos.orderBy('department').keys((departments) => {
alert("Departments are: " + departments.join(','));
console.log(departments);
console.log(typeof departments);
});
}
组件
showTable() {
this.todoService.departments$.subscribe((departments)=>{
this.showDepartments = departments;
console.log(this.showDepartments);
})
不需要第二个 Observable (BehaviorSubject),因为 API 调用已经 returns 一个你可以使用的 Observable。
更好的是,像这样更改它:
组件
departments$ = this.todoService.departments$;
模板
*ngFor = "let dept of departments$ | async"
使用声明式方法可确保 UI 自动与发送到流中的任何内容同步。
有关 declarative/reactive 方法的更多信息,请参阅此处的第一个演讲:https://www.youtube.com/watch?v=iSsch65n8Yw
我用 Promise 解决了这个问题
searchDepartments(){
return this.db.todos.orderBy('department').keys((departments) => {
alert("Departments are: " + departments.join(','));
console.log(departments);
console.log(typeof departments);
if (departments && departments.length != 0) {
return departments;
} else {
return undefined;
}
});
}
并且在 DeborahK 建议的组件中。
async showTable() {
this.connection = await this.todoService.searchDepartments();
console.log(this.connection);
}
我在从服务订阅一个对象时在组件中得到一个空数组。 我使用了主题行为并尝试将数据从主题传递到组件,但在组件上返回了一个空数组。
服务:-
allPassedData: BehaviorSubject<any> = new BehaviorSubject<any>([]);
searchDepartments() {
const fetchData3 = this.db.todos.orderBy('department').keys((departments) => {
alert("Departments are: " + departments.join(','));
console.log(departments); //<============== ["data","accounts"]
console.log(typeof departments); //<========== object
this.allPassedData.next(departments);
});
}
getDep(): Observable<any[]> {
return this.allPassedData.asObservable();
}
组件
showTable() {
this.todoService.getDep().subscribe((departments)=>{
this.showDepartments = departments;
console.log(this.showDepartments); <=============== [] empty
})
试试这样的方法:
服务
departments$ = this.db.todos.orderBy('department').keys((departments) => {
alert("Departments are: " + departments.join(','));
console.log(departments);
console.log(typeof departments);
});
}
组件
showTable() {
this.todoService.departments$.subscribe((departments)=>{
this.showDepartments = departments;
console.log(this.showDepartments);
})
不需要第二个 Observable (BehaviorSubject),因为 API 调用已经 returns 一个你可以使用的 Observable。
更好的是,像这样更改它:
组件
departments$ = this.todoService.departments$;
模板
*ngFor = "let dept of departments$ | async"
使用声明式方法可确保 UI 自动与发送到流中的任何内容同步。
有关 declarative/reactive 方法的更多信息,请参阅此处的第一个演讲:https://www.youtube.com/watch?v=iSsch65n8Yw
我用 Promise 解决了这个问题
searchDepartments(){
return this.db.todos.orderBy('department').keys((departments) => {
alert("Departments are: " + departments.join(','));
console.log(departments);
console.log(typeof departments);
if (departments && departments.length != 0) {
return departments;
} else {
return undefined;
}
});
}
并且在 DeborahK 建议的组件中。
async showTable() {
this.connection = await this.todoService.searchDepartments();
console.log(this.connection);
}