时间戳

首页 > 解决方案 > 带有锚标记（划分）刷新的角度 URL 转到主页

angular - 带有锚标记（划分）刷新的角度 URL 转到主页

问题描述

我在 Angular 应用程序中实现了可访问性合规性，它工作正常，但是我在 url “ http://localhost:4200/#/getdata/bulkdata#main-content ”中遇到了一个小问题，我添加了带有 div 的锚标记id（我页面的主要内容），到目前为止它工作正常，但任何 Ctrl+R 或刷新 url 都会进入主页。

我正在使用角度和打字稿。

非常感谢任何帮助。

请参阅下面的代码以获取 html 文件

<a href="#main-content" class="skip">Skip to main content</a>

下面是 .ts 文件的代码

    ngOnInit() {

  $(".skip").click(function(event){    

     $('html,body').animate({
      scrollTop: $(window).scrollTop() + 150
      });

    this.href = " ";
    $('#skipfooter').removeAttr('tabindex');

    if(window.location.href.indexOf('login') >=0){
      this.href=window.location.href + "#main-Content-login";   
    }

    else if (window.location.href.indexOf('#main-content') == -1){
        (this.href=window.location.href + "#main-content");
      } 
    else {this.href=window.location.href;      
    }

    var skipTo="#"+this.href.split('#')[2];       
        // Setting 'tabindex' to -1 takes an element out of normal,tab flow but allows it to be focused via javascript
    $(skipTo).attr('tabindex', -1).on('blur focusout', function () {    
         // when focus leaves this element, remove the tabindex attribute
    $(this).removeAttr('tabindex');    
   }).focus(); // focus on the content container
        });       
      }
}

标签： angularurlrefreshanchor

解决方案

推荐阅读