Riley Ge avatar

使用Angular Js后超链接<a>不工作问题

rileyge

Published: 23 Feb 2018 › Updated: 23 Feb 2018

使用Angular Js后超链接<a>不工作问题

问题的发现

在用SteemConnect V2进行开发的时候,发现了一个问题:使用Angular JS后,超链接标签 <a href='location'>click</a>不起作用。表现为:单击后浏览器地址改变,但不会进行跳转。

开始并没有关注此问题,认为只是速度问题,但后来发现几乎所有页面都有这个问题。

原因

使用Angular Js配置了$locationProvider to html5Mode(下文代码第3行),如我在sc2-cookie中使用形式:

angular.module('app', ['ipCookie'])
  .config(['$locationProvider', function($locationProvider){
    $locationProvider.html5Mode(true);
  }]);

此时就会出现上述问题。

解决方案一(欠完美方案)

在标签中添加 target="_self" 来保证跳转。

为什么说是欠完美方案,如果只有一个页面中用了Angular Js还好说,随手就加上了,但如果全站使用,那么工作量就很大了。而且有时a标签是自动生成的,还要到程序里面找,非常不方便。

解决方案二(完美方案)

angular.module('app', ['ipCookie'])
    .config(['$locationProvider', function ($locationProvider) {
        $locationProvider.html5Mode({
            enabled: true,
            requireBase: true,
            rewriteLinks: false
        });
    }]);

问题解决。

参考:javascript - AngularJS tag links not working - Stack Overflow

Leave 使用Angular Js后超链接<a>不工作问题 to:

Written by

I am an engineer, a programer, a man love my wife very much.

Read more #cn posts


Best Posts From Riley Ge

We have not curated any of rileyge's posts yet. But you can encourage our curation team to review posts by visiting them regularly and by referring other readers. Because we give priority to frequently read content.

More Posts From Riley Ge