在订阅内分配的变量在订阅外为空?我不知道,但是,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道,我不知道。谁来帮帮我解释一下。我试图获取订阅的值,然后在html中呈现它,但该值仅在订阅事件内部检索,而不在外部检索。我能做些什么来让它在组件的其余部分。谢谢大家。
我的服务**
import { Injectable } from '@angular/core';
import { Api } from 'src/app/services/api.service';
import { environment as env } from 'src/environments/endpoints';
import { ICode } from '../components/login/login.interfaces';
import { Observable, Subject } from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class AuthService {
private rol$: Subject<any>
constructor(
private api: Api,
) {
this.rol$ = new Subject()
}
async verifyCode(data: ICode) {
const res = await this.api.post(env.auth.login, data)
.then((res) => {
if (!res.error) {
this.isAuthenticated = res.isAuth
this.setRol(res.rolUser)
}
})
.catch((err) => {
console.log(err)
return false
})
return this.isAuthenticated
}
getRolUser$(): Observable<any> {
return this.rol$.asObservable()
}
setRol(rolUser: any) {
this.rol$.next(rolUser)
}
}
}我的组件;
import { AuthService } from 'src/app/services/auth.service';
import { Observable } from 'rxjs';
@Component({
selector: 'app-panel-widgets',
templateUrl: './panel-widgets.component.html',
styleUrls: ['./panel-widgets.component.scss']
})
export class PanelWidgetsComponent implements OnInit {
rolUser$: Observable<any>;
constructor(
private _auth : AuthService,
) {
}
ngOnInit(){
this._auth.getRolUser$().subscribe(e => this.rolUser$ = e)
console.log('Valor del subscribe __ ', this.rolUser$)
}
}
Html模板
<p class="text">
<span><b>Usuario : </b><p style="right: 0px;">{{usuario}}</p></span>
<span><b>Email : </b>{{email}}</span>
<span><b>Rol : </b>{{ rolUser$ | async }}</span>
</p>
2条答案
按热度按时间xoefb8l81#
将
console.log
放入订阅回调中,您会注意到它将在订阅外部的日志之后被记录。这两条路径不同步。您可以查阅Promises和如何使用async/await以及rxjs的文档
另外,如果您想使用异步管道,则不需要在订阅本身内部设置值
在你TS做这样的事情:
这样,Observable就可以进入异步管道了,就像你已经在做的那样
fwzugrvs2#
最后,这个工作原理:
服务项目
我用BehaviorSubject代替Subject
在我的组件中:
和模板html;