Angular 角度2将值从服务传递到组件

内部服务职能：

getUserInfo（）{
this.af.authState.subscribe（authData=>{
让email=authData.email；
让array=this.database.list（'registeredUsers'{
查询：{
orderByChild:“电子邮件”，
equalTo:电子邮件
}
}).订阅（数据=>{
让userFName=data[0]。firstName；
});
});
}

组成部分：

ngOnInit（）{
this.afService.getUserInfo（）；
}

---

函数本身工作得很好，但是如何传递要在组件中使用的

let userFName

变量？

听起来您想要的是使其成为一个可注入的服务。这将允许您从任何组件对其进行调用

最好创建一个新的承诺返回，一旦database.list调用被解析，您就可以解析它

@Injectable（）
导出类MyService（）{
公共用户名称；
getUserInfo（）{
//返回一个新的承诺，该承诺在获得数据后即得到解决
返回新承诺（（解决、拒绝）=>{
this.af.authState.subscribe（authData=>{
让email=authData.email；
让array=this.database.list（'registeredUsers'{
查询：{
orderByChild:“电子邮件”，
equalTo:电子邮件
}
}).订阅（数据=>{
让userFName=data[0]。firstName；
//使用用户名解析承诺
解析（userFName）；
});
});
});
}
}

你的部件呢

@组件({
提供者：[MyService]
)
}
导出类MyComponent{
构造函数（私有myService:myService）{
myService.getUserInfo（）.then（userFName=>{
log（'userFName='，userFName）；
});
}
}

听起来您想要的是使其成为一个可注入的服务。这将允许您从任何组件对其进行调用

最好创建一个新的承诺返回，一旦database.list调用被解析，您就可以解析它

@Injectable（）
导出类MyService（）{
公共用户名称；
getUserInfo（）{
//返回一个新的承诺，该承诺在获得数据后即得到解决
返回新承诺（（解决、拒绝）=>{
this.af.authState.subscribe（authData=>{
让email=authData.email；
让array=this.database.list（'registeredUsers'{
查询：{
orderByChild:“电子邮件”，
equalTo:电子邮件
}
}).订阅（数据=>{
让userFName=data[0]。firstName；
//使用用户名解析承诺
解析（userFName）；
});
});
});
}
}

你的部件呢

@组件({
提供者：[MyService]
)
}
导出类MyComponent{
构造函数（私有myService:myService）{
myService.getUserInfo（）.then（userFName=>{
log（'userFName='，userFName）；
});
}
}

如果使用

@angular/http

您的http请求应该返回

rxjs/Observable

。一旦你订阅了它，它就会返回订阅。无法重新订阅订阅类

import {Observable} from "rxjs";
@Injectable()
export class MyService() {

    public userFName;
    getUserInfoPromise():Observable<MyResponseType> {
        let someObservable = this.someApi.someRequestPOST(request).mergeMap((response:MyResponsType) => {
         //you can process the response data here before components use it
              this.userFName = response.userFName;
              return new Promise(resolve => resolve(response));
         });
         return someObservable;
    }
}

---

如果您使用

@angular/http

，您的http请求应该返回

rxjs/Observable

。一旦你订阅了它，它就会返回订阅。无法重新订阅订阅类

import {Observable} from "rxjs";
@Injectable()
export class MyService() {

    public userFName;
    getUserInfoPromise():Observable<MyResponseType> {
        let someObservable = this.someApi.someRequestPOST(request).mergeMap((response:MyResponsType) => {
         //you can process the response data here before components use it
              this.userFName = response.userFName;
              return new Promise(resolve => resolve(response));
         });
         return someObservable;
    }
}

---

“你怎么会双重订阅一个可观察的？”奥马尔珀说，他没有？第一个订阅是authState，第二个是数据库。列表你是如何双重订阅一个可观察对象的？@omeralper他没有？第一个订阅是authState，第二个是数据库。listI得到的错误是：组件中的订阅类型“subscription”上不存在“Property”subscripte。Oops没有意识到这是一个嵌套的承诺，已修复，因此getUserInfo函数返回一个新的承诺，您可以在内部database.list调用完成后解决此问题。我发现组件中.subscribe的类型“subscription”上不存在错误“Property”subscripte。Oops未意识到这是一个嵌套承诺，已修复，因此getUserInfo函数返回了一个新承诺，一旦内部database.list调用完成，您就可以解析它。