相对HREF路径与html5mode angularjs出错 [英] relative href path goes wrong in angularjs with html5mode
问题描述
我用AngularJS来处理我的网址与html5mode开启。我还使用了一口角发生器生成项目。
I'm using AngularJS to handle my urls with html5mode turned on. I'm also using the gulp-angular generator to build the project.
情况：
index.js
$locationProvider
.html5Mode(true);
index.html的
index.html
<!-- build:css({.tmp,src}) styles/app.css -->
<!-- inject:css -->
<link rel="stylesheet" href="app/index.css">
<!-- endinject -->
<!-- endbuild -->
<base href="/" />
问题
在网址为 example.com/somepage ，index.css从 example.com/app/index.css 但是当URL是 example.com/somepage/somedeeperpage ，我刷新页面，index.css从 example.com/得到SomePage的/应用/ index.css
When url is example.com/somepage, index.css is gotten from example.com/app/index.css but when url is example.com/somepage/somedeeperpage, and I refresh the page, index.css is gotten from example.com/somepage/app/index.css
我希望能够在默认情况下在角一饮而尽发生器使用相对路径的。
I want to be able to use the relative paths as by default in the angular-gulp generator.
我必须改变基础标签，或在gulpfile index.css相对路径？
Do I have to change to base tag, or index.css rel path in the gulpfile?
奇怪的是，相对路径工作正常查找index.js
Strangely, the relative path is working fine for finding index.js
亲切的问候
推荐答案
编辑：只是想通了，如果我把标签的之前的风格它的工作注入。 ..我的index.html现在看起来是这样的：
just figured out that if I put the tag before the injection of styles it works... My index.html looks like this now:
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<base href="/">
<!-- build:css({.tmp/serve,src}) styles/app.css -->
<!-- inject:css -->
<!-- endinject -->
<!-- endbuild -->
</head>
previous答案：
Previous answer :
有同样的问题，在我的index.html文件添加和通过改变一饮而尽/ inject.js的一饮而尽，注入配置做这项工作：
Had the same issue, made this work by adding in my index.html file and by changing the gulp-inject config in gulp/inject.js :
在
var injectOptions = {
ignorePath: [options.src, options.tmp + '/serve'],
addRootSlash: false
};
在
var injectOptions = {
ignorePath: [options.src, options.tmp + '/serve']
};
这篇关于相对HREF路径与html5mode angularjs出错的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
