AngularJS HTML5模式在手动URL更改时执行整页重新加载

时间:2015-01-24 22:02:57

标签: angularjs apache .htaccess angular-ui-router angularjs-routing



我正在使用AngularJS和ui.router。我已经看到Hashbang和HTML5模式的行为差异,我想知道它是否可以更改/阻止。 使用时

$locationProvider.html5Mode(true);

当我手动更改地址栏中的网址时,会发生整页重新加载。 例如,如果我目前在网址

http://example.com/post/5467777

然后手动将其更改为

http://example.com/post/5464777

发生拉页重装,然后加载正确的状态。

如果我不使用HTML5模式,则不会发生整页重新加载,而是在更改网址时直接加载状态(当然要快得多)

http://example.com/#/post/5467777

到另一个。 我对HTML5模式的服务器端配置如下所示:

# Don't rewrite files or directories
RewriteCond %{REQUEST_FILENAME} -f [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^ - [L]
# Rewrite everything else to index.html to allow html5 state links
RewriteRule ^ index.php [L]

我认为AngularJS也可以拦截这些URL更改。如果可能,在HTML5模式下手动更改网址时如何才能重新加载页面?

感谢

1 个答案:

答案 0 :(得分:7)

这里没有错。这是浏览器的预期行为。使用哈希时,阻止重新加载的事实是您在同一页面内请求一个部分(id等于哈希的元素)(因此无需重新加载)。如果URL发生变化,浏览器除了认为它是新页面之外不能做其他事情。

当您点击某个页面时,angular会拦截该点击并相应更改地址栏中的网址。