duplicate navbar once the user is logged in
JavaZakariae opened this issue · 2 comments
The <ul *appShowAuthed="true" class="nav navbar-nav pull-xs-right"> is renderer many times.
To reproduce the bug:
- After the user is logged in, and the user click successively on new article->Home ->new article->Home
The nav bar is duplicated as shown in the image.
Is the bug related to the fact that we are not unsubscribing from the observable:
import {
Directive,
Input,
OnInit,
TemplateRef,
ViewContainerRef,
} from "@angular/core";
import { UserService } from "../core/services/user.service";
@Directive({
selector: "[appShowAuthed]",
standalone: true,
})
export class ShowAuthedDirective implements OnInit {
constructor(
private templateRef: TemplateRef<any>,
private userService: UserService,
private viewContainer: ViewContainerRef
) {}
condition: boolean = false;
ngOnInit() {
this.userService.isAuthenticated.subscribe((isAuthenticated: boolean) => {
if (
(isAuthenticated && this.condition) ||
(!isAuthenticated && !this.condition)
) {
this.viewContainer.createEmbeddedView(this.templateRef);
} else {
this.viewContainer.clear();
}
});
}
@Input() set appShowAuthed(condition: boolean) {
this.condition = condition;
}
}
For duplication found some issue in the ngOnInit() of editor.component.ts if we comment it, the duplication of nav links does not happen.
Issue i found was in the get() method in article.service.ts we're trying to get an article but that'll always return bad request because https://[api.realworld.io/api/articles/ returns an array, now from there we need to filter based on our slug value, i could not get data based on that url. Please let me know if you get some solution.
@JavaZakariae Thanks for the report: the problem was the existing view was not checked before adding it.
@shambhu-22 the get
function is using a slug already. Feel free to add more context if needed.