如何改变路线并使可观察的工作?
How to change the route and make the observable work?
我正在尝试从 observable 加载信息,当我输入路由时它会正确加载,但是当我使用 routerLink 更改路由时,observable 停止显示管道异步信息。
我展示observable信息的方式是这样的:
配置文件组件
<ng-container *ngIf="this.observable| async as profilevar; else loading">
<div class="main-content">
<div class="profile-content shadow">
<div class="profile-content-top">
<div class="profile-image">
<div class="profile-image-avatar">
<img src="{{ profilevar?.profile_url }} "
这里是包含更改路线的元素的组件:
导航栏组件
<div class="nav-bar-mobile">
<div class="element-bar profile" routerLink="/profile" routerLinkActive="selecteditem">
<i class="fas fa-user-circle"></i>
</div>
<div class="element-bar settigs" routerLink="/settings" routerLinkActive="selecteditem">
<i class="fas fa-cog"></i>
</div>
</div>
什么有效:
- 直接从浏览器路径加载数据
什么不起作用:
- 当我使用导航栏组件和 routerLink 更改路线时
变量this.observable包含this.db.object('/profiles/' + vid).valueChanges()
我该如何解决这个问题?
已解决
经过调查,我找到了问题的解决方案!
我设法通过在订阅类型变量中分配我的可观察值来解决它。
export class ProfileComponent implements OnInit, OnDestroy {
subscriptionObservable: Subscription;
observable: Observable<Profile>;
constructor(){
this.subscriptionObservable = this.observable.subscribe((data: Profile) =>
{...}));
}
ngOnDestroy() {
if (this.subscriptionObservable) {
this.subscriptionObservable.unsubscribe();
}
}
}
完成组件后,我取消订阅 subscriptionObservable 变量!
我正在尝试从 observable 加载信息,当我输入路由时它会正确加载,但是当我使用 routerLink 更改路由时,observable 停止显示管道异步信息。
我展示observable信息的方式是这样的:
配置文件组件
<ng-container *ngIf="this.observable| async as profilevar; else loading">
<div class="main-content">
<div class="profile-content shadow">
<div class="profile-content-top">
<div class="profile-image">
<div class="profile-image-avatar">
<img src="{{ profilevar?.profile_url }} "
这里是包含更改路线的元素的组件:
导航栏组件
<div class="nav-bar-mobile">
<div class="element-bar profile" routerLink="/profile" routerLinkActive="selecteditem">
<i class="fas fa-user-circle"></i>
</div>
<div class="element-bar settigs" routerLink="/settings" routerLinkActive="selecteditem">
<i class="fas fa-cog"></i>
</div>
</div>
什么有效:
- 直接从浏览器路径加载数据
什么不起作用:
- 当我使用导航栏组件和 routerLink 更改路线时
变量this.observable包含this.db.object('/profiles/' + vid).valueChanges()
我该如何解决这个问题?
已解决
经过调查,我找到了问题的解决方案!
我设法通过在订阅类型变量中分配我的可观察值来解决它。
export class ProfileComponent implements OnInit, OnDestroy {
subscriptionObservable: Subscription;
observable: Observable<Profile>;
constructor(){
this.subscriptionObservable = this.observable.subscribe((data: Profile) =>
{...}));
}
ngOnDestroy() {
if (this.subscriptionObservable) {
this.subscriptionObservable.unsubscribe();
}
}
}
完成组件后,我取消订阅 subscriptionObservable 变量!