单击任何具有href='#'的锚链接时，Angular路由器路径
{ path: '', component: NologinComponent, pathMatch: 'full' }
，我应该如何处理这些锚链接，以便href='#'的锚点停留在同一页面上，即什么也不做。
示例锚标记
<a class="title-logo" href="#"><img src="/Content/Images/Image1.png"></a>
还有一点需要考虑，我在布局页面中使用了<base href="/" />，以便刷新角度保持在当前页面上并查找来自＆＃34; /＆＃34;的资源。不是来自当前组件内部。
答案 0 :(得分：12)
有几个选择：
选项1：
使用指令覆盖List<String> mappingFiles = new ArrayList<String>();
mappingFiles.add("map.xml");
Source source = new Source("1", "2", "3", "4", "5", "6");
DozerBeanMapper mapper = new DozerBeanMapper(mappingFiles);
Destination destination = mapper.map(source, Destination.class, "k");
属性：
href就个人而言，我喜欢这种解决方案，因为它具有全局性和棱角分明性。这是一个stackblitz example。
选项2
您可以使用css并放弃@Directive({
selector : '[href]'
})
export class MyLinkDirective {
@Input() href: string;
@HostListener('click', ['$event'])
noop(event: MouseEvent) {
if(this.href.length === 0 || this.href === '#') {
event.preventDefault();
}
}
}
属性：
href然后您的非活动链接将是：
a {
cursor: pointer;
user-select: none;
}
选项3
CSS <a class="title-logo"><img src="/Content/Images/Image1.png"></a>
：
pointer-events用法
a.noop {
pointer-events: none;
}
<a class="title-logo noop" href="#"><img src="/Content/Images/Image1.png"></a>
可能会给某些（尤其是较旧的）浏览器带来麻烦。您可以看到兼容性列表here。
答案 1 :(得分：3)
试试这个
href='javascript:void(0);'
答案 2 :(得分：1)
由于添加此功能非常棘手，我建议您不要重新发明轮子，请查看ng2-page-scroll。
如果您想进行更多调查，请阅读Router & Navigation Guide。
答案 3 :(得分：-1)
示例方式可能是添加这段代码event.preventDefault（）;。在事件函数中..
例如
函数fn（事件）{
event.preventDefault（）;
...
}