作者:驴友团的新家处_273 | 来源:互联网 | 2023-02-10 15:31
我正在搜索如何使用服务来获取用户的数据
users.services.ts
import { AngularFire, AuthProviders, AuthMethods, FirebaseListObservable}
export class Users {
uid :string = '8fbEOShqIigfA4u84cyvJcLkv5u1';
constructor(public af: AngularFire) {}
getUserObservable(){
return this.af.database.object('/users/' + this.uid);
}
}
在这里我的家
import { Users } from '../../services/users.service';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
user: any;
isAuthenticated: boolean = true;
constructor(private userService: Users) {}
ngOnInit(){
this.userService.getUserObservable().subscribe((userObject) => {
this.user = userObject;
console.log("result : ", this.user);
});
}
}
在控制台我得到:
result : Object {imgLink: "blabla.jpg", money: 0, score: 0, uid: "8fbEOShqIigfA4u84cyvJcLkv5u1", username: "Luis Willnat"…}
但在离子视图中:
Cannot read property 'money' of undefined
我认为这是因为异步(我不能很好地练习),但不知道是什么......
非常感谢您的帮助 :)
1> AngularChef..:
您需要以不同方式设置代码.通常,当服务包装异步调用时 - 任何异步调用,而不仅仅是Firebase - 它的方法应该返回observable,而不是observable发出的值.
即使你想要,也不方便(或者可能)尝试返回包含在observable中的值,因为只有当observable发出时它们才可用,并且你无法控制它何时发生.
根据这些准则,您的代码将变为:
@Injectable()
export class UserService {
constructor(public af: AngularFire) {}
getUser() {
// Return the observable. DO NOT subscribe here.
return this.af.auth;
// Hint: you could also transform the value before returning it:
// return this.af.auth.map(authData => new User({name: authData.name}));
}
}
然后,在您的组件中或您需要的任何位置,您订阅以获取用户:
ngOnInit() {
this.userService.getUser()
.subscribe(user => this.user = user);
}