[英]Angular: How to override nested href with routerLink?
I have a third-party package that is using an href attribute on a nested anchor tag.我有一个在嵌套锚标记上使用href属性的第三方 package。 Of course, I don't want to navigate using href .
当然,我不想使用href导航。 I applied a routerLink directive on the parent because I have no way of accessing and modifying the child component.
我在父组件上应用了routerLink指令,因为我无法访问和修改子组件。 But the href attribute overrides everything.
但是href属性会覆盖所有内容。 How can I force angular to use the routerLink directive?
如何强制 angular 使用routerLink指令?
My code looks like this:我的代码如下所示:
<ngx-gallery routerLink="home" [options]="galleryOptions" [images]="galleryImages"></ngx-gallery>
First of all, in the source code and documentation from
ngx-gallery
I can't find any reference of an anchor tag being set, but if you say there is, I should believe you.
首先,在
ngx-gallery
的源代码和文档中,我找不到任何设置锚标记的参考,但如果你说有,我应该相信你。
You can however try to manually remove the href
value from the anchor tag.但是,您可以尝试手动从锚标记中删除
href
值。 You can even write a separate directive for it:你甚至可以为它编写一个单独的指令:
@Directive({
selector: '[disableLinks]'
})
export class DisableLinksDirective implements AfterViewInit, OnInit, OnDestroy {
private destroy$ = new Subject<void>();
constructor(
private el: ElementRef<HTMLElement>
@Optional() @Self() private gallery: NgxGalleryComponent
) {}
ngOnInit(): void {
if (this.gallery) {
merge(
this.gallery.imagesReady,
this.gallery.change,
this.gallery.previewChange
).pipe(
takeUntil(this.destroy$)
).subscribe(() => this.disableLinks())
}
}
ngAfterViewInit(): void {
this.disableLinks();
}
ngOnDestroy(): void {
this.destroy$.next();
this.destroy$.complete();
}
private disableLinks(): void {
this.el.nativeElement.querySelectorAll('a').forEach((a) => a.href = '');
}
}
Which you can then set on your element:然后您可以在您的元素上设置:
<ngx-gallery
disableLinks
routerLink="home"
[options]="galleryOptions"
[images]="galleryImages">
</ngx-gallery>
I don't exactly know if any of those events will trigger the href to be updated again, but that's for you to find out:)我不完全知道这些事件中的任何一个是否会触发 href 再次更新,但那是你自己找出来的:)
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.